重学前端-学习笔记-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

转载于:https://juejin.im/post/5d0b9af45188251627587961