javascript原型链关系详细说明
js原型链基础
在现代化框架的使用下,原生js的代码几乎用不上了,导致js的特性很多人不清楚,网上关于原型的说明文章有很多,但是称呼不一致,让新手越看越晕。
js的原型对象
所有的js对象中可以定义自己的属性和方法,所有的js对象都会从该对象的原型对象中继承属性和方法。原型对象中有属性和方法,说明原型对象本质也是一个对象。
js的构造函数
所有的对象都是经过new关键字创建的,包括定义的数组[],对象{},正则/^$/g等,也是语法糖,也是通过new关键字和构造函数创建的。构造函数就是js的普通函数,和new一起使用后该函数会被js引擎重新调用,并且发生一些变化。
- 函数的返回值不受控制,强制返回一个对象。
- 函数作用域的this强制指向该函数返回的对象。
- 返回的对象的原型对象被指向了函数的prototype。
通过new和构造函数创建一个对象obj,下面简称obj。来说明构造函数,实例对象和原型对象三者的关系
构造函数和原型对象的关系。
- 访问obj的constructor属性,发现指向了该对象的构造函数。
- constructor属性并不是在obj的身上,而是在obj所创建的原型对象身上。obj只不过继承了原型对象的属性和方法。也就是说原型对象的constructor指向了构造函数。
- 构造函数的prototype属性指向了原型对象。
构造函数.prototype.constructor === 构造函数
形成了闭环,该公式一定要记住。
实例对象obj和原型对象的关系
- obj有一个属性__proto__属性,指向了obj的原型对象,当然可以继续向上指,原型对象也有__proto__指向原型对象的原型对象。
- 可以通过标准的api过去obj的原型对象,通过
Object.getPrototypeOf(obj)
的返回值是obj的原型对象 Object.getPrototypeOf(obj) === obj.__proto__
该公式需要记住。- 指定一个对象的原型对象,(一)直接修改
obj.__proto__
该方法不推荐。(二)使用Object.create()
创建一个新的对象,使用现有对象来作为新创建对象的原型对象。(三)Object.setPrototypeOf()
方法用于重新指定一个对象的原型对象。
构造函数和实例对象的关系
-
instanceof
运算符用于检测构造函数的prototype
属性是否出现在某个实例对象的原型链上。用来检测obj实例是不是由某个构造函数创建的。 -
实例对象的constructor指向了构造函数,实际上是因为实例对象继承了原型对象和构造函数的关系(不靠谱的关系)。
检查对象某属性是否存在
- "."和""[attr]"取出后判断是否和undefined相等,因为对象不存在某属性取出来的是undefined。
- 使用in关键字,for ... in可以遍历对象和对象原型上所有可枚举的属性。in判断该属性在是否对象或者在其原型上。
- 使用hasOwnPrhasoperty()方法判断自身是否拥有该属性。
- Object.keys(obj)返回对象自身所有可枚举属性的键名所组成的数组。(对应
hasOwnPrhasoperty()
方法) - Object.getOwnPropertyNames(obj)返回对象的所有可枚举和不可枚举的键名所组成的数组。(对应
in
关键字)
出处:博客园-解放牌翻斗车(https://www.cnblogs.com/mmxuehan)
本文属于原创作品,欢迎转载,但 [必须在页面明显位置标明原文链接],否则博主保留追究相关人士法律责任的权利。