ES6～ES14 之 对象篇

JavaScript 对象新增特性（ES6～ES14）

以下是 ES6 到 ES14 中与对象相关的重要新增特性：

---

ES6（2015）

1. 简洁的属性和方法表示法
   • 属性名与变量名一致时可以省略。
   • 方法可以直接定义为函数。

const name = 'John';
const obj = { name }; // 等价于 { name: name }

const obj = {
    greet() {
        console.log('Hello!');
    }
};

2. 对象解构赋值
   • 从对象中提取值并分配到变量。

const obj = { a: 1, b: 2 };
const { a, b } = obj; // a = 1, b = 2

3. 计算属性名
   • 使用表达式动态生成属性名。

const key = 'dynamic';
const obj = { [key]: 42 }; // { dynamic: 42 }

4. Object.assign
   • 浅拷贝对象或合并多个对象。

const target = { a: 1 };
const source = { b: 2 };
Object.assign(target, source); // { a: 1, b: 2 }

---

ES7（2016）

1. Object.values
   • 返回对象所有值的数组。

const obj = { a: 1, b: 2 };
Object.values(obj); // [1, 2]

2. Object.entries
   • 返回对象所有键值对的数组。

const obj = { a: 1, b: 2 };
Object.entries(obj); // [['a', 1], ['b', 2]]

---

ES8（2017）

1. Object.getOwnPropertyDescriptors
   • 获取对象所有属性的描述符。

const obj = { a: 1 };
Object.getOwnPropertyDescriptors(obj);
// { a: { value: 1, writable: true, enumerable: true, configurable: true } }

2. 对象扩展运算符（Rest 和 Spread）
   • Rest：提取剩余属性。
   • Spread：拷贝或合并对象。

const { a, ...rest } = { a: 1, b: 2, c: 3 }; 
// rest = { b: 2, c: 3 }

const obj1 = { a: 1 };
const obj2 = { b: 2 };
const merged = { ...obj1, ...obj2 }; // { a: 1, b: 2 }

---

ES10（2019）

1. Object.fromEntries
   • 将键值对数组转换为对象。

const entries = [['a', 1], ['b', 2]];
Object.fromEntries(entries); // { a: 1, b: 2 }

---

ES12（2021）

1. 逻辑赋值运算符
   • 使用逻辑运算符简化对象属性赋值。

const obj = { a: 1 };
obj.a ||= 2; // 等价于 obj.a = obj.a || 2
obj.b &&= 2; // 等价于 obj.b = obj.b && 2
obj.c ??= 3; // 等价于 obj.c = obj.c ?? 3

2. 对象属性的私有化
   • 使用 # 定义私有属性（class 内部使用）。

class MyClass {
    #privateField = 42;
    getPrivate() {
        return this.#privateField;
    }
}

---

ES13（2022）

1. Object.hasOwn
   • 一个更安全的方法替代 obj.hasOwnProperty。

const obj = { a: 1 };
Object.hasOwn(obj, 'a'); // true

---

ES14（2023）

1. JSON 模式匹配增强
   • 虽然不直接改动对象，但 JSON 的处理能力得到增强。

---

通过这些特性，JavaScript 提供了更强大的对象操作能力，同时简化了开发中的繁琐工作。