重学前端-学习笔记-JavaScript对象

说明

重学前端是程劭非（winter）在极客时间开的一个专栏，在此主要整理个人学习笔记。若有侵权，请联系我，谢谢。

javascript对象特征

• 对象具备惟一标识性：彻底相同的两个对象，也不是同一个对象
• 对象具备状态：同一对象会处于不一样状态下
• 对象具备行为：行为能够改变对象的状态

对象的惟一性是用内存地址来体现的， 对象具备惟一标识的内存地址，全部具备惟一标识性。

var o1 = { a: 1 };
 var o2 = { a: 1 };
 console.log(o1 == o2); // false
复制代码

对象的行为和状态在js里是对象的属性。

var o = { 
        d: 1,
        f() {
            console.log(this.d);
        }    
    };

复制代码

在js里对象是动态的，能够在运行时给对象添加属性。

var o = { a: 1 };
    o.b = 2;
    console.log(o.a, o.b); //1 2
复制代码

javascript对象的两类属性

在js里，属性不是简单的名称和值，js用一组特征(attribute)来描述属性(property)

数据属性的四个特征

• value：属性的值
• writable：属性是否能被赋值
• enumrable：可否用for in枚举该属性
• configurable：可否被删除或修改

访问器（getter/setter）属性的四个特征

• getter：函数或undefined，在取属性值的时候被调用
• setter：函数或undefined，在设置属性值的时候被调用
• enumrable：可否用for in枚举该属性
• configurable：可否被删除或修改

访问器属性使得属性在读和写时执行代码，它容许使用者在写和读属性时，获得彻底不一样的值，它能够视为一种函数的语法糖。

咱们一般用于定义属性的代码会产生数据属性，其中的writable、enumerable、configurable 都默认为true，能够用getOwnPropertyDescriptor来查看

var o = { a: 1 };
    o.b = 2;
    //a 和 b 皆为数据属性
    Object.getOwnPropertyDescriptor(o,"a") // {value: 1, writable: true, enumerable: true, configurable: true}
    Object.getOwnPropertyDescriptor(o,"b") // {value: 2, writable: true, enumerable: true, configurable: true}
复制代码

若是咱们要想改变属性的特征，或者定义访问器属性，咱们能够使用defineProperty

var o = { a: 1 };
    Object.defineProperty(o, "b", {value: 2, writable: false, enumerable: false, configurable: true});
    //a 和 b 都是数据属性，但特征值变化了
    Object.getOwnPropertyDescriptor(o,"a"); // {value: 1, writable: true, enumerable: true, configurable: true}
    Object.getOwnPropertyDescriptor(o,"b"); // {value: 2, writable: false, enumerable: false, configurable: true}
    o.b = 3;
    console.log(o.b); // 2

复制代码

在定义对象时，能够用get和set关键字来定义访问器属性

var o = {
  get a(){return 1}
}

console.log(o.a)
复制代码

访问器属性跟数据属性不一样，每次访问属性都会执行 getter或者 setter 函数。这里咱们的 getter 函数返回1，全部o.a返回1

js对象在运行时是一个“属性的集合”，属性以字符串或者symbol为key，以数据属性特征值或者访问器属性特征值为value