面向对象之笔记三-------------- 原型链

  1. 复习 -> 继承

     原型式继承
         function Person() {}
         Person.prototype = 父对象;
         var p = new Person();
         p 继承自 父对象
     混入 ( mix, extend )
         function extend( o1, o2 ) {
             for ( var k in o2 ) {
                 o1[ k ] = o2[ k ];
             }
         }
     注意命名规则:
         1> 一般 将一个对象混入另一个对象, 使用 mix
         2> 如果是当前对象的方法. 是将另一个对象混入当前对象一般使用 extend
    
  2. 对象的原型链 -> 凡是对象都有原型 -> 构造函数 Person 创建的对象 p 有原型 Person.prototype

    -> Person.prototype 是对象. 它有原型吗? -> 问题:

     1) 原型是什么?
     2) 原型既然是对象, 那么如何是个头?    
    

    -> 结论

     1) Person.prototype 是 实例 p 的原型对象, 使用 __proto__ 可以访问对象的原型对象
     2) Person.prototype 的 原型对象是 Person.prototype.__proto__
     3) Person.prototype.__proto__ 里的 constructor 是 Object. 所以
         Person.prototype.__proto__ 就是 Object.prototype
     4) Object.prototype.__proto__ 是 null. 因此表明 Object.prototype 就是顶级.
    

    -> 链式

     p --> Person.prototype( p.__proto__ ) --> Object.prototype --> null
    

    -> 系统内置的原型链

     [] --> Array.prototype --> Object.prototype --> null
     /./ --> RegExp.prototype --> Object.prototype --> null
     ... ...
    
  3. 绘制数组的原型结构 var arr = []; // 等价 var arr = new Array();

    arr --> Array.prototype --> Object.prototype --> null

  4. 练习: 根据下面代码绘制对象的原型链结构 1) function Person( name, age, gender ) {
         this.name = name;
         this.age = age;
         this.gender = gender;
     }
     function Student () {}
    
     Student.prototype = new Person( ‘张三‘, 19, ‘男‘ );
    
     var stu = new Student();
    
2)  function Person() {}
    var p1 = new Person();
    var p2 = new Person();
  1. {} 对象的原型链结构 在 js 中 对象 一般都有字面量

     123, ‘123‘
    

    数组: [] 正则表达式对象: /./ 函数: function () {} ...

    对象也有字面量: {} {} --> Object.prototype --> null

    注意: {} 与 new Object() 含义相同

  1. 动态函数 Function -> 动态函数就是在运行的过程中, 将一段字符串作为代码运行.

     由于字符串可以随意的拼接. 因此得到动态的执行.
     ( 动态生成代码  然后再去执行它)
    

    -> 定义动态函数, 并执行

     -> 使用 Function 构造函数, 创建函数.
         Function 是一个构造函数!!!. new Function 会得到 **一个函数**(函数也是一个对象)
     -> 语法
         new Function( arg0, arg1, ..., argN, body )
    
         Function 的所有的参数(都是字符串), 除了最后一个以外, 都是生成的函数的参数
         最后一个参数是 函数体
    

    // 案例1: 求两个数字的和 -> function getSum ( num1, num2 ) {

     **return num1 + num2;**
    

    }**

    动态函数 --> var getSum2 = new Function ( ‘num1‘, ‘num2‘, ‘return num1 + num2;‘ );

        调用动态函数创建的函数  getSum2(100,200)
    

    注意:这里面的参数都是字符串!

    函数的相关的一些参数 arguments 凡是函数调用, 都会默认含有一个 arguments 对象. 可以将其看做为 "数组". 里面存储着调用时传入的所有参数. 可以使用数组的索引访问这些参数.

     例如: 写一个函数, 在参数中写任意个参数, 最后求其和
         function sum () {
             // 所有的参数都会存储到 arguments 中
             var sum = 0;
             for ( var i = 0; i < arguments.length; i++ ) {
                 sum += arguments[ i ];
             }
             return sum;
         }
    
     案例:     extend( o )  => 将 o 混入到当前对象 this 中
             extend( o1, o2 ) => 将 o2 混入到 o1 中
    

    函数名.length, 即函数的 length 属性. 表示 定义函数时, 参数的个数

    如果定义函数的时候, 定义了参数. 但是调用的时候又没有传递该参数. 那么该参数在函数内就是 undefined

    函数.name 返回的是函数名

  2. 函数的引用 callee 与 caller js 中函数也是一个对象 -> callee 在函数的内部, 它表示 当前函数 的引用arguement.callee(); (递归函数用法) -> caller 表示调用函数 函数名.caller
  3. eval 函数 eval 函数与 Function 功能类似. eval 可以直接将字符串作为代码来执行. 语法:
     eval( 语句字符串 )
    

    注意, 它与当前代码处于同一个作用域

  4. 使用 ajax 获得 json 格式的字符串后, 转换成对象
  5. 在 js 中 函数 是 Function 的实例

    function Person() {} var p = new Person(); p 是 构造函数 Person 的实例

    在 该角度去看, 函数就是对象, Function 就是构造函数

    得到 构造-实例-原型 三角形

    function Person() {} 为例

  6. 给定一个任意的对象, 将其原型链包括对象和函数的结构完整的分析处理
  7. instanceof 运算符 -> a of b -> b 的 a -> instance of ? -> 错觉: 判断某一个对象是否为某一个构造函数所创建出来的
  1. 通过原型链的学习, 可以重新定义 js 的继承

    js 的继承: 就是利用对象的动态特性添加成员, 或直接替换对象的方式修改原型链

            结构. 使得当前对象的原型链上的对象具有某些成员. 那么我的当前对象
            就可以使用这些成员了.
    

    p -> Person.prototype -> Object.prototype -> null p -> Person.prototype -> {} -> Object.prototype -> null

    过多的依赖原型链继承, 会损耗 性能 如果必须使用原型链继承, 最好提供一些快速访问的方法

时间: 2024-10-13 17:49:48

面向对象之笔记三-------------- 原型链的相关文章

笔记-[面向对象]-包装对象和原型链-[3]

基本数据类型都有自己的包装对象:如 String .Number.Boolean 包装对象如何来: <script> var str="helloworld";//str是字符串类型 str.charAt(0);//为什么str不是对象,却能够使用String对象的方法 </script> 因为 str有它的包装对象Sting对象,过程是基本类型会找到对应的包装对象类型,然后把包装对象的属性和方法继续过来,最后包装对象消失, 所以str.charAt(0);可以

深入javascript面向对象,js的原型链、继承

进阶面向对象----------------------– 在JS源码中,系统对象也是基于原型的程序, 尽量不要去添加和修改系统对象的方法 包装对象----------------------– 基本类型都有自己对应的包装对象 比如String Number Boolean 基本类型会找到对应的包装对象类型,然后包装对象把所有的属性方法给了 基本类型,然后包装对象消失 例如 var str = 'abc'; str.num = 10; //创建一个包装对象,给包装对象加num属性,然后立刻消失.

JS面向对象(2)——原型链

原型链用于ECMAScript的继承.其思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.说人话,我们知道,一个构造函数Subtype,其原型对象有一个指向构造函数的指针,这是联系构造函数和原型的桥梁,如果我让原型对象的指针指向了另一个原型,而另一个原型原本指向其构造函数的指针也指向了另一个原型,那么,这就是一个原型链了,原型上的属性会一层一层往下传递. function SuperType(){ this.property=true; } SuperType.prototype.ge

javascript学习笔记11(原型链)

<script type="text/javascript">    /**     * js实现继承的第一种方式是基于原型链的方式     */    function Parent() {        this.pv = "parent";    }    Parent.prototype.pp = "ok";    Parent.prototype.showParentValue = function() {        a

JS高级(三)--原型链、闭包、作用域、函数的四种调用方式

一.原型链(家族族谱) 概念:JS里面的对象可能会有父对象,父对象还会有父对象,.....祖先 根本:继承 属性:对象中几乎都会有一个__proto__属性,指向他的父对象 意义:可以实现让该对象访问到父对象中相关属性 根对象:Object.prototype var arr=[1,3,5] arr.__proto__:Array.prototype arr.__proto__.__proto__就是找到了根对象 function Animal(){} var cat=new Animal();

面向对象之笔记二——————原型与继承

原型与继承 原型 为什么需要原型? 构造器创建对象的时候, 实际上会有成员重复 如果使用 构造器 this.方法名 = function .... 方式创建对象. 那么每一个对象对应的方法就会重复 function Person( name ) { this.name = name; this.sayHello = function() { console.log( '你好,我是 ' + this.name ); }; } var p1 = new Person( 'Hello' ); var

C# 面向对象系列笔记(三)

v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VML);} .shape {behavior:url(#default#VML);} Normal 0 false 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE /* Style Definitions */ table.MsoNormalTable {

原型,原型对象,原型链,构造函数,继承(一)

前言:javascript中 万物皆对象 , 但是对象是有区别的 分为普通对象(object)和函数对象(function): ①由以下三种形式创建的对象为函数对象: function fun1(){} var fun2 = function(){} var fun3 = new Function(); console.log(typeof fun1);//function console.log(typeof fun2);//function console.log(typeof fun3);

用ECMAScript4 ( ActionScript3) 实现Unity的热更新 -- 使用原型链和EventTrigger

原型链是JS的必备,作为ECMAScript4,原型链也是支持的. 特别说明,ActionScript3是支持完整的面向对象继承支持的,原型链只在某些非常特殊的情况下使用. 本文旨在介绍如何使用原型链. 任意对象类型都有一个prototype属性,包括导入的Unity的API也有.我们可以和JS一样的对这个prototype进行操作,比如动态的添加成员,添加方法等. 如果您决定使用原型链,那么必须舍弃编译时类型检查.如果使用强类型,则编译器会认为动态添加的成员不存在,而提示编译错误.解决办法为去