#新手很容易混淆prototype和__proto__,今天就来聊聊这两个吧~#
首先区分:prototype是构造函数的,__proto__是对象的:
1. prototype 原型(的)对象:由构造函数使用。构造函数定义时系统自动会分配一个原型。
2. __proto__ 对象(的)原型 :(实质上是getter和setter,会对设置的值自动进行判断) 是通过对象直接调用的。一种非标准属性,是访问器属性。
1. prototype是构造函数的属性:
重点:实例的__proto__属性会指向该构造函数的prototype对象。
function Star() { }
let str = new Star()
console.log(str.__proto__ === Star.prototype);//true
//重点:即实例化对象的__proto__属性指向构造函数的prototype属性
//可以这样想:实例的爸爸是构造函数,所以实例对象的(对象)原型__proto__的爸爸就是构造函数的prototype(原型)对象。
2. 普通对象没有prototype属性(实例对象自己也没有):
普通对象的原型链引用是通过 __proto__ 属性(非标准但广泛支持)或者 Object.getPrototypeOf() 方法来访问和操作的。
//1.
let hs = { age: 19 }
//这里是先给对象添加prototype属性,然后再添加其他属性:
hs.prototype = {
show() {
console.log('houdunrne.com');
}
}
console.log(hs);
//2.
let th = { age: 19 }
console.log(th);
// 添加prototype属性,并给prototype添加多种属性:
th.prototype = {
constructor: Object,//constructor指向(该原型对象的)构造函数(普通函数的构造函数是Object)。
show() {
console.log('houdunrne.com');
},
render() {
console.log('pink');
}
}
console.log(th)
//3普通函数给父级添加单一属性(添加到Object上了):
let it = {}
console.log(it);
it.__proto__.show = function () {
console.log('js');
}
console.log(it);
```
3.原型方法:
1.Object.isPrototypeOf()原型检测
//原型检测的Object可以自由发挥:
let hd={}
let re={}
hd.prototype=re
console.log(re.isPrototypeOf(hd))//true,即判断hd的原型是否是re
2.Object.setPrototype()设置原型
3.Object.getPrototype()得到原型
5.in和hasOwnProperty查找属性:
1.hasOwnProperty:
let a = { name: 'jack' }
let b = { url: 'houcunren.com' }
console.log('name' in a);
Object.setPrototypeOf(a, b)
console.log('url' in a);//true,即in会攀升,查找原型链
console.log(a.hasOwnProperty('url'));//false,即hasOwnProperty不会查找原型链
2. in:
//在for-in 中,因为in会攀升,所以要判断:
let object = { name: 'houdunren' }
let object2 = { url: 'js.com' }
Object.setPrototypeOf(object, object2)
for (const key in object) {
if (object.hasOwnProperty(key)) {
console.log(key);//name
console.log(object[key]);//houdunren
}
}
晚安煲仔们,今天让自己多多休息哦~
羽毛球是个不错的运动,但是很费胳膊就是了🤦!!!