原型链 | 显示原型、隐式原型 | 构造关系constructor | instanceof

1、原型关系 prototype

显式原型:prototype             

隐式原型:__proto__

1. 每个函数function都有一个prototype,即显式原型(属性)
2. 每个实例对象都有一个__proto__,可称为隐式原型(属性)

3. 对象的隐式原型的值为其对应构造函数的显式原型的值

4. 总结:

  * 函数的prototype属性: 在定义函数时自动添加的, 默认值是一个空Object对象

  * 对象的__proto__,默认指向其构造函数的prototype

  * Object.prototype的__proto__属性指向null。(Object构造函数的原型的隐式原型指向null)

  * __proto__虽然可以改写,但性能消耗大、风险高、最重要的是被“已被W3C废弃”(链接),可以用等效替换方法 Object.getPrototypeOf(obj) == obj.__proto__

// Function 与 Object 原型链关系
console.log(Function.prototype.__proto__ == Object.prototype) // true
console.log(Object.prototype.__proto__) // null

// 声明的函数
function fun1(){}
console.log(fun1.prototype.__proto__ == Object.prototype) // true
console.log(fun1.prototype.__proto__ == Function.prototype.__proto__) // true

var o1 = new fun1()
function fun2(){}
fun2.prototype = o1
console.log(fun2.prototype != fun1.prototype) //true

var o2 = new fun2()
console.log(o2.__proto__ == fun2.prototype) // true
// 创建一个对象、空对象 的隐式原型指向 Object的原型
var obj = new Object() // 等效 var obj = {}
console.log(obj.__proto__ == Object.prototype) // true

2、构造关系 constructor

  * 对象和函数都有construction属性

  * Object的construction属性指向Function,而Function的construction指向自己

  * constructor属性并不是实例化的对象的属性,而是其构造函数的原型对象的constructor属性,会通过原型链往上一直找到头

  * 可以用来查找原型链的“尽头”(实际创建的构造函数的尽头),constructor也可以重指向

// Function 与 Object 构造constructor 关系
console.log(Object.constructor == Function) // true
console.log(Function.constructor == Function) // true

// 通过关键字function 进行函数声明
function fun1(){}
//通过函数声明的函数,constructor指向 Function
console.log(fun1.constructor == Function)

var o1 = new fun1()
// 通过构造函数创建的对象,constructor指向它的构造函数
console.log(o1.constructor == fun1) //true

function fun2(){}
fun2.prototype = o1
var o2 = new fun2()
// constructor默认不是指向 实例化对象的构造函数
console.log(o2.constructor != fun2) //true
// 是指向其构造函数的原型的constructor,通过原型链向上一直找到头
console.log(o2.constructor == fun1) //true

function fun3(){}
fun3.prototype = o2
var o3 = new fun3()
// o3这个孙级对象实例,constructor依然指向祖级原型的constructor
console.log(o3.constructor == fun1) //true
// 所以有时候,会重定向constructor
o3.constructor = fun3
console.log(o3.constructor == fun3) 

 

posted @ 2019-11-08 17:34  刘金宇  阅读(645)  评论(0编辑  收藏  举报