日期:2014-05-16  浏览次数:20327 次

javascript 原型链

A)      关于prototype chain有几点说明:

  a.      这个链的终点是Objectprototype对象:Object.prototype

  b.      所有的对象在默认的情况下都有一个原型(__proto__.

  c.      原型本身也是对象,所以每个原型自身又有一个原型(__proto__),除了Object.ptototype.

关于c这个观点可以用一下面的小程序来证明:

  function A(){}
  console.log(A.prototype.__proto__);//Object {}
  console.log(Object.prototype.__proto__);//null

 就这上面两个输出,下面做详细的分析,并说明这个proto链是怎么形成的。

1)  先定义一个简单的函数并创建该函数的对象 var a = new A(); 注意,这里a,没有自己的属性,它的所有的属性都从原型对象上继承而来)现在看看内存中这个对象的具体情况

 

                                                                                          图 1.1 

观察图1.1,可以发现a对象的__proto__属性,这个论证了观点b的正确性。观察prototype对象有一个__proto__属性(绿色方框所示)。这个就说明了观点b的正确性。

但是,prototype的__proto__所代表的对象是谁呢?查看@37891发现,这个对象是一个Object对象,其实说白了就是Object.prototype所指向的对象。下面给出该对象的内存情况:

                                                图 1.2

观察这个对象的constructor,其指向Object的构造器。对比图1.1可以发现,这个对象是没有__proto__属性的,这个对象正是a对象所在的proto链条的终点:Object.pototype.

结合上面的说明,可以得到如下图示:


                                       图 1.3


注意:沿着红色箭头组成了proto链!!!所以console.log(A.prototype__proto__)为Object{},而Object.prototype.__proto__为null.

B)      通过这个prototype chain可以实现属性的继承,例程如下:

function A(x){
    this.x = x ;
  }

  function B(y) {
    this.y = y;
  }

  B.prototype = new A(1);

  function C(z) {
    this.z = z;
  }

  C.prototype = new B(2);

  var c = new C(3);
  var sum = c.x+c.y + c.z;//sum == 6
可以通过chrome浏览器的Take Heap Snapshot来查看对象c的prototype chain。如下图
 

                    图 1.4

&