JavaScript原型和原型链(三)

版权声明:刘家军 https://blog.csdn.net/qq_42911663/article/details/85329692

原型链

原型对象prototype
构造函数constructor
隐式原型__proto__
通过三者之间的联系,形成了原型链
继续看一下我门昨天讨论过的代码

console.log('刘家军'.__proto__ === String.prototype) // true
console.log(String.prototype.__proto__ === Object.prototype) // true
//等量代换,得出以下结论
console.log('刘家军'.__proto__.__proto__ === Object.prototype) // true

我们刚才说过,普通对象的__proto__指向当前函数对象的原型
我们刚才还说过,普通对象都是通过函数创建的
根据以上两个结论我们分析一下上面的代码
"刘家军"是字符串类型,"刘家军"的构造函数是String(), 所以’刘家军’的proto指向String的原型
String是js的内置构造函数,内置构造函数继承自Object
String的原型对象String.prototype也是一个普通对象,它的__proto__指向Object的原型,即Object.prototype
所以

console.log('刘家军'.__proto__.__proto__ === Object.prototype) // true

这就是原型链
我们继续品读以下代码

//我们创建一个构造函数Person(要记得,构造函数命名,首字母要大写)
function Person() {}
//通过我们自定义的构造函数。通过new操作符,我们实例化出来一个对象LJJ
const LJJ = new Person()
//对象的__proto__指向当前函数对象(LJJ是同构Person实例化出来的,所以LJJ的函数对象是Person)的原型
console.log(LJJ.__proto__ === Person.prototype)
//原型对象也存在__proto__,指向该原型对象(Person.prototype)所对应的函数对象(Object)的原型(好像有点绕,看代码就没那么绕了)
console.log(Person.prototype.__proto__ === Object.prototype) // true
//上面的如果懂了,这行代码就简单了,一个数学的等量代换,就得出了结论
console.log(LJJ.__proto__.__proto__ === Object.prototype) // true


//我们通过字面量创建了一个对象,等同于 const obj = new Object()
const obj = {}
// obj 是通过内置构造函数Object创建的,所以,obj的__proto__指向它的函数对象(Object)的原型(prototype)即:Object.prototype
console.log(obj.__proto__ === Object.prototype) // true


//创建一个对象person 
const person = {}
//我们之前说过创建对象有三种方式,我们使用第三种方式创建一个对象LJJ,对象LJJ继承自对象person,也就是说,对象person是对象LJJ的__proto__
const LJJ = Object.create(person)
//对象person是对象LJJ的__proto__
console.log(LJJ.__proto__ === person) // true
//前面已经证实过,person.__proto__ == Object.prototype
console.log(person.__proto__ === Object.prototype) // true
//等量代换就得出以下结论
console.log(LJJ.__proto__.__proto__ === person.__proto__) // true
console.log(LJJ.__proto__.__proto__ === Object.prototype) // true

我们再往下看
由于__proto__ 是任何对象都有的属性,而js里万物皆对象,所以会形成一条__proto__连起来的链条,递归访问__proto__必须最终到头,并且值是null。
当js引擎查找对象的属性时,先查找对象本身是否存在该属性,如果不存在,会在原型链上查找,但不会查找自身的prototype
看下图结合下面代码自己体会一下
在这里插入图片描述

let A = function(){}//等同于let A  = new Function()
let a = new A()
//对象的的__proto__指向它所对象函数对象(A)的原型(A.prototype)
console.log(a.__proto__ === A.prototype) // true
console.log(A.prototype.__proto__ === Object.prototype) // true
//等量代换就得出以下结论
console.log(a.__proto__.__proto__ === Object.prototype) // true

猜你喜欢

转载自blog.csdn.net/qq_42911663/article/details/85329692