原型和原型链

最新推荐文章于 2024-09-22 11:17:00 发布

weixin_30655569

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量58

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/xjy20170907/p/11418860.html

版权

prototype（原型）是函数才有的属性，__proto__（隐式原型）是每个对象都有的属性，__proto__指向它构造函数的prototype。

__proto__最初是一个非标准属性，ES6已将其标准化，可以用标准方法Object.getPrototypeOf()替代

var a = {}；
// a的_proto_指向函数Object的prototype

var A= function() {};
var a = new A();
// a的_proto_指向函数A的prototype

由于__proto__是任何对象都有的属性，而js里万物皆对象，所以会形成一条__propto__连起来的链条，__propto__到顶端最终指向null，上边第二个例子的图解如下：

function Person(name) {
    this.name = name;
}

let person = new Person('kiwi');

讲解person和Object的关系：

1、person是对象，对象都有__proto__（原型指针），指向构造函数的prototype（原型对象）。此处即person的__proto__属性指向Person的prototype。

2、Person是构造函数，构造函数也是函数，函数除了有原型对象外，也有原型指针。函数都是由Function构造出来的，故Person函数的原型指针指向Function的原型对象。此处即Person的__proto__属性指向Function的prototype。

3、Function是内建构造函数，内建构造函数也还是函数，除了有原型对象外，也有原型指针。函数都是由Function构造出来的，Function作为函数，是由其自身构建出来，故Function的原型指针指向其自身的原型对象。此处即Function的__proto__属性指向Function的prototype。

4、Function的原型对象，其本身也是对象，故其__proto__指向Object的原型对象。

图解：

上例中Person的prototype（红圈1）也是对象，同样拥有constructor和__proto__。函数的原型对象的constructor指向自身。函数的原型对象的原型__proto__指向Object的原型对象，因此Person.prototype的constructor属性指向Person；Person.prototype的__proto__属性指向Object的prototype。

Function的prototype（圈2）和Person的原型对象一样，即Function.prototype的constructor属性指向Function;Function.prototype的__proto__属性指向Object的prototype。

Object作为JavaScript中的内建构造函数，同样拥有原型指针和原型对象。Object既然是函数（构造对象的函数），故其__proto__指向Function的prototype。Object的prototype同样包含constructor和__proto__。Object的prototype的constructor指向自身。Object的prototype的__proto__指向null。此处即Object的__proto__属性指向Function的prototype;Object.prototype的constructor属性指向Object;Object.prototype的__proto__属性指向null。

在JavaScript中原型链的尽头指向null。由上可知：Object.__proto__ === Function.prototype；Function.prototype.__proto__ === Object.prototype，即Object作为内建函数由Function构造出来，Function作为内建构造函数又是对象。

下边为完整图解：