ES之花齐放，对象自有芳香！

2023-09-08 19:44:01

在软件开发中，数据类型是至关重要的组成部分，它是数据形式和操作的集合。在JavaScript中，对象（object）是这种类型的基本组成部分，也正是这种基础，使得JavaScript具有如此强大的力量。而ECMAScript 2015对对象进行了重大升级，使其在特性和功能上有了进一步的发展，这无疑是JS发展历程中的一件大事。

ES新特性之对象的扩展

1. 对象的简写形式

ES6引入了对象简写形式，它允许我们在声明对象时省略冒号和引号，这种简化可以让我们的代码更加简洁。

// ES5
var person = {
  name: "John",
  age: 30
};

// ES6
const person = {
  name: "John",
  age: 30
};

2. 对象的解构赋值

ES6还引入了对象的解构赋值，它允许我们从对象中提取特定的值并将其分配给变量。这使得我们的代码更加清晰和易读。

// ES5
var person = {
  name: "John",
  age: 30
};

var name = person.name;
var age = person.age;

// ES6
const { name, age } = person;

3. 对象的扩展运算符

ES6中的对象扩展运算符（...）允许我们将一个对象的所有属性复制到另一个对象中。这使得我们可以轻松地创建新的对象，而不必手动复制每个属性。

// ES5
var person1 = {
  name: "John",
  age: 30
};

var person2 = {
  ...person1,
  city: "New York"
};

// ES6
const person2 = {
  ...person1,
  city: "New York"
};

4. 对象的Symbol属性

ES6中的Symbol属性允许我们在对象中添加自定义的属性，这些属性不会出现在对象的for-in循环或JSON.stringify()方法中。这使得我们可以将私有数据存储在对象中，而不会暴露给外部世界。

// ES6
const person = {
  name: "John",
  age: 30,
  [Symbol("secret")]: "This is a secret"
};

console.log(person.name); // "John"
console.log(person.age); // 30
console.log(person[Symbol("secret")]); // "This is a secret"

for (const key in person) {
  console.log(key); // "name" and "age"
}

console.log(JSON.stringify(person)); // "{}"

5. 对象的Proxy

ES6中的对象Proxy允许我们在对象上创建一个代理对象，这个代理对象可以拦截对对象的操作，并在操作发生时执行特定的逻辑。这使得我们可以对对象的访问和操作进行控制，并实现一些高级的功能，如数据的验证、缓存和日志记录。

// ES6
const person = {
  name: "John",
  age: 30
};

const proxy = new Proxy(person, {
  get: function(target, property) {
    console.log("Getting property:", property);
    return target[property];
  },
  set: function(target, property, value) {
    console.log("Setting property:", property, "to", value);
    target[property] = value;
  }
});

proxy.name; // "Getting property: name"
proxy.age = 31; // "Setting property: age to 31"