验证中...
article.md
Raw Copy

原型链图

掌握这张图,下面的就不用看了
原型链图

概念介绍

js 中的对象具有_proto_属性,指向它的原型对象,原型对象也有原型对象,一直往上,直到 Object.prototype,到 null 为止, 对象自身没有的属性或者方法,会一直沿着原型对象链往上找,直到Object.prototype

js 中的函数也是对象,所以也有_proto_属性,指向Function.prototypeFunction.prototype._proto_Object.prototype
此外当函数作为构造函数时,还特有一个prototype属性,指向它所创造的实例的原型对象,原型对象的属性construstor又指向这个函数

function Function(){}是一个特殊的函数,它的构造函数是自身,所以F._proto_指向F.prototypeF.prototype.constructor指向 F

//构造函数 Person
function Person(name){
	this.name = name
}

//构造函数通过 new 生成实例
var p = new Person("tom");

//p 的 _proto_ 指向它的原型对象,即 Person.prototype
console.log(p.__proto__ === Person.prototype) // true
//原型对象的 constructor 属性指向实例的构造函数
console.log(Person.prototype.constructor === Person) // true

//p 的原型对象的构造函数是 Object,所以原型对象的原型对象是 Object.prototype
Person.prototype._proto_ === Object.prototype //true

//Object.prototype 再向上找原型对象就是 null
Object.prototype._proto_ === null //true

//在 p 的原型对象上添加属性 age
Person.prototype.age = 18;

//在 Object.prototype 上添加方法 sayHi
Object.prototype.sayHi = function (){console.log("hi")}

// p 自身只有一个 name 属性,并无 age 属性和 sayHi 方法
console.log(p) // {name:"tom"}

//p 自身没有 age 属性,会自动向 p 的原型对象上寻找 age 属性,找到,则停止向上找
console.log(p.age) // name, 18

//p自身没有 sayHi 方法,p 的原型对象上也没有,则继续向上找,找到了 Object.prototype,找到了 sayHi
p.sayHi() // hi

Comment list( 0 )

You need to Sign in for post a comment

Help Search