在 ES6 中，我们已经看到了许多新的语言特性，比如箭头函数、模板字符串、解构赋值等等。而在 ES7 中，展开语法也成为了一项新特性。展开语法可以让我们更方便地处理数组和对象，同时也可以提高代码的可读性和可维护性。本文将介绍 JavaScript ES7 的展开语法，包括它的语法、用法和示例代码。
1. 展开语法的语法
展开语法使用三个点（...）表示，它的语法如下：
...array // 展开数组 ...object // 展开对象
其中，array 是一个数组，object 是一个对象。
2. 展开语法的用法
2.1 展开数组
展开语法可以把一个数组展开成一个列表，例如：
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = [...arr1, ...arr2]; console.log(arr3); // [1, 2, 3, 4, 5, 6]
在上面的代码中，我们使用了展开语法来将 arr1 和 arr2 数组展开成一个新的数组 arr3。这样就可以更方便地合并多个数组。
除了合并数组，展开语法还可以用于复制数组，例如：
const arr1 = [1, 2, 3]; const arr2 = [...arr1]; console.log(arr2); // [1, 2, 3]
在上面的代码中，我们使用了展开语法来复制 arr1 数组，得到了一个新的数组 arr2。这样就可以更方便地复制数组。
2.2 展开对象
展开语法也可以把一个对象展开成另一个对象，例如：
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const obj3 = { ...obj1, ...obj2 };
console.log(obj3); // { a: 1, b: 2, c: 3, d: 4 }在上面的代码中，我们使用了展开语法来将 obj1 和 obj2 对象展开成一个新的对象 obj3。这样就可以更方便地合并多个对象。
除了合并对象，展开语法还可以用于复制对象，例如：
const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1 };
console.log(obj2); // { a: 1, b: 2 }在上面的代码中，我们使用了展开语法来复制 obj1 对象，得到了一个新的对象 obj2。这样就可以更方便地复制对象。
3. 展开语法的示例代码
下面是一些展开语法的示例代码，可以帮助我们更好地理解它的用法。
3.1 合并数组
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = [...arr1, ...arr2]; console.log(arr3); // [1, 2, 3, 4, 5, 6]
3.2 复制数组
const arr1 = [1, 2, 3]; const arr2 = [...arr1]; console.log(arr2); // [1, 2, 3]
3.3 合并对象
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const obj3 = { ...obj1, ...obj2 };
console.log(obj3); // { a: 1, b: 2, c: 3, d: 4 }3.4 复制对象
const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1 };
console.log(obj2); // { a: 1, b: 2 }4. 总结
展开语法是 JavaScript ES7 中的一项新特性，它可以让我们更方便地处理数组和对象，同时也可以提高代码的可读性和可维护性。在实际开发中，我们可以根据需要使用展开语法来合并、复制数组和对象。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6575bec3d2f5e1655df0749d