怎样更好地明白Javascript对象的自有属性和原型继续属性

Javascript对象具有“自有属性”(own property),也有一些属性是从原型对象继承而来的。为了更好地明白对象自有属性和继承属性下面的示例深切诠释了属性的接见和设置细节。

function Obj () {
    this.z = 3;//自有属性
}

//对象会继承原型里的属性
Obj.prototype.x = 1;
Obj.prototype.y = 2;

var o = new Obj();
console.log(o); //o的打印效果如下图,能够看到其自有属性和继承自原型的属性

《怎样更好地明白Javascript对象的自有属性和原型继续属性》
假定要查询对象o的属性y, 假如o自有属性中不存在y, 那末会继承在o的原型对象中查找属性y。假如原型对象中也没有y,但这个原型对象也有原型,那末继承在这个原型对象的原型上实行查询,直到没找到y或许查找到一个原型是null的对象为止。 对象的原型属性构成了一个“链”。 经由过程这个“链”能够完成属性的继承。

如今假定给对象o的属性x赋值,假如o中已经有属性x(自有属性,不是继承来的)那末这个赋值操纵只转变这个已有属性x的值。假如o中不存在属性x, 那末赋值操纵给o增加一个新属性x。 假如之前o继承了本身的原型对象的x属性,那末这个继承的属性就被新建立的同名属性屏障了。

o.x = 5;
console.log(o);
console.log(o.x);// 5

《怎样更好地明白Javascript对象的自有属性和原型继续属性》
从打印效果能够看到对象建立了一个自有属性x,屏障了之前继承来的x值,这个操纵只影响o这个单一对象,不会影响对象的原型里的x属性,既不会影响其他继承该原型的对象。

var b = new Obj();
console.log(b);
console.log(b.x);//1

我们再把对象o的x属性delete掉,然后再接见属性“x”

delete o.x;//true
o.x; // 1

发明接见o.xx 再次指向了原型对象中的 x属性。
实际上自有属性和继承属性与静态言语的实例属性和类属性很像,因而在编写程序的时刻最好不要把实例属性和类属性运用雷同的名字,由于雷同名字的实例属性会屏障掉类属性,然则当你删除实例属性后,再运用雷同的称号接见到的将是类属性。

在给对象的属性赋值时,是在原始对象上建立属性或许对已有属性赋值,而不会去修正原型链。在Javascript中,只要查询属性时才会体会到继承的存在,而设置属性则和继承无关,该特征能够让我们能够有挑选地掩盖继承的属性。

    原文作者:KevinYan
    原文地址: https://segmentfault.com/a/1190000003057229
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞