深入原型链与构造器

关于原型和对象

众所周知，一个函数被创建时，会自动分配一个属性叫原型(prototype)，而原型中有一个属性叫做构造器(constructor)。constructor指向这个函数本身。

prototype和__ proto __的区别（注：这边的proto其实是两边带下划线的proto，由于简书markdown会自动将两边的下划线转义成强调格式）

• prototype是函数才有的属性
• __ proto __是每个对象都有的属性
• __ proto __ 不是一个规范的属性，只是部分浏览器实现了此属性，对应的标准属性是[[Prototype]]

注：大多数情况下，__ proto __可以理解为 “构造器的原型”，即:

__ proto __ === constructor.prototype

1.所有构造器的constructor都指向Function（构造器有Function Array Object）

2.Function的prototype指向一个特殊匿名函数，而这个特殊匿名函数的__ proto __指向Object.prototype

//函数
var a = function() {};
cosnole.log(a.__proto__); //function() {}
cosnole.log(a.constructor) //function Function() {...} 这里的Function就是构造器
console.log(a.constructor.prototype) //function() {}
// a.__proto__ = a.constructor.prototype


//数组
var b = [];
console.log(b.__proto__); //[Symbol(Symbol.unscopables): Object]
console.log(b.__proto__.__proto__); //Object{} 这才是顶层
console.log(b.constructor); //function Array() {...} 这里的Array就是构造器
console.log(b.constructor.prototype)//[Symbol(Symbol.unscopables): Object]
console.log(b.constructor.prototype.__proto__) //Object {}这才是顶层
//b.__proto__ = b.constructor.prototype

//对象
var c = {};
console.log(c.__proto__); //Object{}
console.log(c.constructor);//function Object() {...} 这里的Object就是构造器
console.log(c.constructor.prototype) //Object{}
//c.__proto__ = c.constructor.prototype

//造物主是__proto__
Array.constructor.prototype  = Array.__proto__//function () {}
Object.constructor.prototype === Object.__proto__//function () {}
Function.constructor.prototype === Function.__proto__//function () {}

//万物之源皆是Object
Function.constructor.prototype.__proto__ === Function.__proto__.__proto__ //Object {}
Object.constructor.prototype.__proto__ === Object.__proto__.__proto__ //Object {}
Array.constructor.prototype.__proto__ === Array.__proto__.__proto__//Object {}

Paste_Image.png

以上这图解释了Object与Function之间的关系，真是变态。

参照：

js原型链图解教程