ES6基础语法之对象介绍

ES6是JavaScript语言的一种标准，它带来了很多新特性，其中之一就是对象的新增功能。对象是JavaScript中最常见的数据类型之一，它可以包含多个属性和方法，并且可以将它们分组起来。在本篇文章中，我们将了解ES6中的对象的基础语法。

1. 对象字面量

对象字面量是一种创建JavaScript对象的简便方法，它使用花括号{}来表示一个对象，并且通过属性名和属性值的键值对来定义对象的各个属性和方法。例如：

let person = {
  name: 'John',
  age: 30,
  sayName: function() {
    console.log(this.name);
  }
};

在上面的例子中，我们创建了一个名为person的对象，它有三个属性：name、age和sayName。注意，sayName属性是一个函数，它使用function关键字定义。

2. 属性名简写

在ES6中，我们可以使用属性名简写来定义对象的属性，这样可以让代码更简洁、更易阅读。例如：

let name = 'John';
let age = 30;

let person = { name, age };

在上面的例子中，我们使用了属性名简写来定义person对象的name和age属性，这里name和age是变量名，它们会自动转换成属性名和属性值。

3. 计算属性名

ES6中的对象也支持计算属性名，也就是说，我们可以动态地定义对象属性名。计算属性名使用方括号来包裹表达式，并且将表达式的值作为属性名。例如：

let propName = 'age';

let person = {
  name: 'John',
  [propName]: 30,
  sayName() {
    console.log(this.name);
  }
};

console.log(person.age); //输出：30

在上面的例子中，我们使用了计算属性名来定义person对象的一个属性，在这里，属性名是一个变量propName的值，也就是"age"。

4. 对象解构赋值

对象解构赋值是一种在ES6中新增的语法，它可以将对象的属性值赋值给变量。例如：

let person = {
  name: 'John',
  age: 30,
  sayName() {
    console.log(this.name);
  }
};

let { name, age } = person;

console.log(name); //输出：John
console.log(age); //输出：30

在上面的例子中，我们使用了对象解构赋值来将person对象的name和age属性赋值给变量name和age。

5. 对象方法

在ES6中，我们可以使用更简洁的语法来定义对象的方法。例如：

let person = {
  name: 'John',
  sayName() {
    console.log(this.name);
  }
};

在上面的例子中，我们使用了ES6中的新语法，使用函数名来定义对象方法，而不是像以前那样使用冒号和function关键字。

6. Object.assign()方法

Object.assign()方法是ES6中新增的一个方法，它可以将多个对象合并成一个新对象。例如：

let obj1 = { a: 1 };
let obj2 = { b: 2 };
let obj3 = { c: 3 };

let newObj = Object.assign({}, obj1, obj2, obj3);

console.log(newObj); //输出：{a: 1, b: 2, c: 3}

在上面的例子中，我们使用了Object.assign()方法将obj1、obj2和obj3合并成一个新对象newObj，并将其赋值给一个空对象{}。注意，Object.assign()方法会改变 个参数对象{}的属性。

总结

ES6为JavaScript对象带来了很多新功能，包括对象字面量、属性名简写、计算属性名、对象解构赋值、对象方法和Object.assign()方法等。这些新功能让我们更容易地创建和使用JavaScript对象，并带来了更好的代码可读性和可维护性。如果你还没开始使用ES6，不妨尝试一下，相信它会让你的开发体验更加愉快。