【重学前端】JavaScript对象:具有高度动态性的属性集合

88 阅读3分钟

什么是面向对象?

对象(Object) 是一切事物的总称。对象并不是计算机领域凭空造出来的概念,它是顺着人类思维模式产生的一种抽象。

在《面向对象分析与设计》这本书中,Grady Booch总结如下:

  1. 一个可以触摸或者可以看见的东西;
  2. 人的智力可以理解的东西;
  3. 可以指导思考或行动(进行想象或施加动作)的东西。

Java就是使用“类”的方式来描述对象。 但是Brendan Eich在早期却选择了一个更为冷门的方式: 原型。后来因为Java大火,JavaScript推出之时受管理层要求模仿Java,所以Brendan Eich在“原型运行时”的基础上引入了new、this等语言特性,让它“看起来像Java”。

其实从运行时角度来看,任何语言运行时类的概念都是被弱化的。执行时考虑的是对象本身的属性了,类只是在程序编写时方便程序员理解和程序设计。

JavaScript对象的特征

对象的特点:

  • 对象具有唯一标识性:即使完全相同的两个对象,也并非同一个对象。

对象具有唯一标识的内存地址

  • 对象具有状态:同一对象可能处于不同状态之下。

  • 对象具有行为:对象的状态可能因为它的行为产生变迁。

属性 = 状态 + 行为

除以上的对象基本特诊,JavaScript中对象独有的特色是:对象具有高度的动态性,这是因为JavaScript赋予了使用者在运行时为对象添改状态和行为的能力。

JavaScript对象的属性

数据属性

数据属性比较接近于其他语言的属性概念,它具有四个特征:

  • value:属性的值
  • writable:决定属性能否被赋值
  • enumerable:决定for in能否枚举该属性
  • configurable:决定该属性能否被删除或者改变特征值

访问器(getter/setter)属性

访问器属性也有四个特征:

  • getter:函数或undefined,在取属性值时被调用
  • setter:函数或undefined,在设置属性值时被调用
  • enumerable:决定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}

如果我们想要改变属性的特征,或者定义访问器属性,我们可以使用 Object.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); // 1

访问器属性跟数据属性不同,每次访问属性都会执行 getter 或者 setter 函数。这里我们的 getter 函数返回了 1,所以 o.a 每次都得到1。

所以可以这么理解,JavaScript对象的运行时是一个“属性的集合”,属性以字符串或者Symbol为key,以数据属性特征值或者访问器属性特征值为 value。对象是一个属性的索引结构