当前位置:网站首页>JS 原型原型链
JS 原型原型链
2022-08-03 05:43:00 【无知小九】
1. 对原型、原型链的理解
js 的对象是由构造函数构造的, 每个构造函数内部都有 Prototype 属性, 这个属性的值就是一个对象, 这个对象包含了构造函数所有实例共享的属性和方法.
当用构造函数新建对象后, 对象的内部会包含一个指针, 这个指针指向构造函数 prototype 对应的值, 这个指针被称为对象的原型. 浏览器中可以用 proto 来访问这个属性, ES5 也可以用 Object.getPrototypeOf 来获取对象的原型.
如果访问一个对象时, 对象内部不存在这个属性, 就会去它的原型对象里找这个属性, 这个原型对象也有自己的原型, 这样找下去就是原型链的概念
详细资料可以参考:
《JavaScript 深入理解之原型与原型链》
![image][image-7]
1.1. 原型修改、重写
function Person(name) {
this.name = name
}
// 修改原型
Person.prototype.getName = function() {
}
var p = new Person('hello')
console.log(p.__proto__ === Person.prototype) // true
console.log(p.__proto__ === p.constructor.prototype) // true
// 重写原型
Person.prototype = {
getName: function() {
}
}
var p = new Person('hello')
console.log(p.__proto__ === Person.prototype) // true
console.log(p.__proto__ === p.constructor.prototype) // false
可以看到重写原型的时候p的构造函数不是指向Person了,因为直接给Person的原型对象直接用对象赋值时,它的构造函数指向的了根构造函数Object,所以这时候p.constructor === Object
,而不是p.constructor === Person
。要想成立,就要用constructor指回来:
Person.prototype = {
getName: function() {
}
}
var p = new Person('hello')
p.constructor = Person
console.log(p.__proto__ === Person.prototype) // true
console.log(p.__proto__ === p.constructor.prototype) // true
1.2. 原型链指向

function Person() {
}
let p = new Person()
p.__proto__ // Person.prototype
Person.prototype.__proto__ // Object.prototype
p.__proto__.__proto__ //Object.prototype
p.__proto__.constructor // Person
Person.prototype.constructor // Person
p.__proto__.constructor.prototype.__proto__ // Object.prototype
Person.prototype.constructor.prototype.__proto__ // Object.prototype
1.3. 原型链的终点是什么?如何打印出原型链的终点?
由于Object
是构造函数,原型链终点是Object.prototype.__proto__
,而Object.prototype.__proto__=== null // true
,所以,原型链的终点是null
。原型链上的所有原型都是对象,所有的对象最终都是由Object
构造的,而Object.prototype
的下一级是Object.prototype.__proto__
。
![image][image-8]
1.4. 如何获得对象非原型链上的属性?
所有继承了 Object 的对象都会继承到 hasOwnProperty 方法。这个方法可以用来检测一个对象是否含有特定的自身属性,和
in 运算符不同,该方法会忽略掉那些从原型链上继承到的属性。
使用后hasOwnProperty()
方法来判断属性是否属于原型链的属性:
function iterate(obj){
var res=[];
for(var key in obj){
if(obj.hasOwnProperty(key))
res.push(key+': '+obj[key]);
}
return res;
}
详细资料可以参考:
《Object.prototype.hasOwnProperty()》
1.5. js 获取原型的方法?
- p.__proto__
- p.constructor.prototype
- Object.getPrototypeOf§
边栏推荐
猜你喜欢
随机推荐
CISP-PTE真题演示
Getting Started with Chrome Plugin Development
Cesium loads offline maps and offline terrain
信息学奥赛一本通T1453:移动玩具
Shell脚本--信号发送与捕捉
信息学奥赛一本通T1454:山峰和山谷
postman配置中文
Autowired注解与Resource注解的区别
Spark 的架构与作业提交流程
MySQL 操作语句大全(详细)
mysql的配置文件(my.ini或者 my.cnf)所在位置
DIFM network, rounding and repetition
MySQL的on duplicate key update 的使用
MySQL 日期时间类型精确到毫秒
Embedding two implementations of the torch code
mysql 时间字段默认设置为当前时间
MySQL中的行锁
MySQL的触发器
Nacos单机模式的安装与启动
Multi-Head-Attention principle and code implementation