Js 原型和原型链

Js中通过原型和原型链实现了继承

Js对象属性的访问，首先会查找自身是否拥有这个属性

如果查到，则返回属性值，如果找不到，就会遍历原型链，一层一层的查找，如果找到就会返回属性值

直到遍历完Object.prototype还没有找到，则返回undefined

对象中有：__proto__(原型)，函数也是对象，所以也有__proto__

构造函数中有：prototype对象，默认有一个叫做constructor的属性，指向这个构造函数本身。

对象的__proto__(原型)引用了创建这个对象的构造函数的prototype对象

 function Baz() {}

 Baz.prototype.sayAge = function() {

     console.log(this.age);

 }

 function Bar() {

     this.name = 'Gary';

     this.age = 20;

 }

 Bar.prototype = Object.create(Baz.prototype);

 Bar.prototype.constructor = Bar;

 Bar.prototype.sayName = function() {

     console.log(this.name)

 }

 var obj = new Bar();

 console.log(obj.sayAge()); //

分析：

obj对象由Bar构造函数创建，所以obj对象的__proto__(原型)指向Bar.prototype

在Bar.prototype中使用object.create()，使得Bar.prototype的__proto__指向了Baz.prototype

Baz.prototype是一个对象，由构造函数Object创建，所以Baz.prototype的__proto__指向了Object.prototype

特殊的：最后Object.peototype的__proto__指向null

由此构成的一条原型链：obj -> Bar.prototype -> Baz.prototype -> Object.prototype -> null

根据开头的对象属性查找规则，obj调用sayAge打印出了20

Js 原型和原型链

几个原型指向：

function fn(){...} ===>>> var fn = new Function(...)

所以函数的__proto__指向Function.prototype

同理：

function Object(){} ===>>> var obj = new Object()

function Function(){} ===>>> var fn = new Function()

构造函数的__proto__指向Function.prototype

秒客网

Js 原型和原型链

相关文章