重学前端学习笔记（七）--JavaScript对象：面向对象仍是基于对象？

笔记说明

重学前端是程劭非（winter）【前手机淘宝前端负责人】在极客时间开的一个专栏， 天天10分钟，重构你的前端知识体系，笔者主要整理学习过程的一些要点笔记以及感悟，完整的能够加入winter的专栏学习【原文有winter的语音】，若有侵权请联系我，邮箱：kaimo313@foxmail.com。

一、学习JavaScript面向对象时是否有这样的疑惑？

• 为何 JavaScript（直到 ES6）有对象的概念，可是却没有像其余的语言那样，有类的概念呢？
• 为何在 JavaScript 对象里能够自由添加属性，而其余的语言却不能呢？

二、什么是面向对象？

2.一、JavaScript 对象的特征

2.1.一、对象的特征（来自《面向对象分析与设计》一书）

• 对象具备惟一标识性：即便彻底相同的两个对象，也并不是同一个对象。
• 对象有状态：对象具备状态，同一对象可能处于不一样状态之下。
• 对象具备行为：即对象的状态，可能由于它的行为产生变迁。

关于第一点：

var a1 = { a: 1 };
var a2 = { a: 1 };
console.log(a1 == a2); // false

关于第2、三点:

• c++中称"状态和行为"为成员变量和成员函数
• java中则称它们为属性和方法
• javaScript中将状态和行为统一抽象为属性

winter举了个例子，代码以下：

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

上面代码中，o是对象，d是一个属性，而函数f也是一个属性，只是写法不同，总结来讲，在JavaScript中，对象的状态和行为其实都被抽象为了属性。

2.1.二、JavaScript 中对象独有的特点

对象具备高度的动态性，这是由于 JavaScript 赋予了使用者在运行时为对象添改状态和行为的能力。

举例说明运行时如何向一个对象添加属性：

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

为了提升抽象能力，JavaScript的属性被设计成比别的语言更加复杂的形式，它提供了数据属性和访问器属性（getter/setter）两类。

2.二、JavaScript 对象的两类属性

2.2.一、数据属性

4个特征：

• value：就是属性的值.
• writable：决定属性可否被赋值.
• enumerable：决定 for in 可否枚举该属性.
• configurable：决定该属性可否被删除或者改变特征值.

2.2.二、访问器（getter/setter）属性

2.2.2.一、4个特征：

• getter：函数或 undefined，在取属性值时被调用.
• setter：函数或 undefined，在设置属性值时被调用.
• enumerable：决定 for in 可否枚举该属性.
• configurable：决定该属性可否被删除或者改变特征值.

2.2.2.二、Object.getOwnPropertyDescripter 和 Object​.define​Property()

var o, d;

o = { get foo() { return 17; } };
d = Object.getOwnPropertyDescriptor(o, "foo");
// d {
//   configurable: true,
//   enumerable: true,
//   get: /*the getter function*/,
//   set: undefined
// }

o = { bar: 42 };
d = Object.getOwnPropertyDescriptor(o, "bar");
// d {
//   configurable: true,
//   enumerable: true,
//   value: 42,
//   writable: true
// }

o = {};
Object.defineProperty(o, "baz", {
  value: 8675309,
  writable: false,
  enumerable: false
});
d = Object.getOwnPropertyDescriptor(o, "baz");
// d {
//   value: 8675309,
//   writable: false,
//   enumerable: false,
//   configurable: false
// }

实际上 JavaScript 对象的运行时是一个“属性的集合”，属性以字符串或者 Symbol 为 key，以数据属性特征值或者访问器属性特征值为 value。

2.三、小结

• 因为 JavaScript 的对象设计跟目前主流基于类的面向对象差别很是大，致使有“JavaScript 不是面向对象”这样的说法。
• JavaScript 语言标准也已经明确说明，JavaScript 是一门面向对象的语言，跟JavaScript 的高度动态性的对象系统密不可分。

我的总结

看完winter的这篇文章深感本身的基础之薄弱，越模糊的东西越要清楚其本质，才能保持对事物的正确判断。