在今天谈论出色的JavaScript功能的情节中，我们将把注意力转移到传播操作员（...）或传播语法上。在本文的末尾，您将找到我过去写过其他一些JavaScript概念和功能的其他文章的链接列表。同时，让我们专注于传播操作员（...），它的全部内容以及如何使用它来编写更好的JavaScript代码。
vrail语法是一个JavaScript功能，它允许对象和迭代（例如阵列和字符串）被解开或扩展，可用于制作数据结构的浅副本以提高数据操作的易度性。它通常与破坏性结合使用。
传播操作员使用的是什么？
该操作员可用于轻松执行许多常规任务。传播操作员可用于执行以下操作：
-
复制数组
-
串联或组合数组
-
使用数学功能
-
使用数组作为参数
-
将项目添加到列表
-
组合对象
让我们看一下每个用例的示例。
复制数组
使用传播操作员是复制数组或组合数组的便捷方法，甚至可以添加新项目。
const animals = ['🦁','🐘','🐈','🐕🦺','🐇']
const moreAnimals = [...animals];
console.log(moreAnimals) // Array(5) ['🦁','🐘','🐈','🐕🦺','🐇']
组合或串联阵列
传播操作员可用于快速组合两个阵列。
const myArray = [1,2,3];
const yourArray = [4,5];
const ourArray = [...myArray,...yourArray];
console.log(ourArray); // Array(5) [ 1, 2, 3, 4, 5 ]
使用Math函数
我认为，了解使用点运算符的使用的最佳方法是查看内置函数Math.min()和Math.max()，这两者都期望参数列表，而不是数组。假设您有一系列数字，并且希望获得该数组中最小或最大的数字，您将必须使用Math.min()或Math.max()，但是将数组传递给任何这些功能都会返回NaN，这不是您的答案' D希望。相反，您应该使用（...）运算符将数组作为Math函数中的参数列表展开，如下示例：
const numbers = [28, -6, 19, 0]
console.log(Math.min(numbers)) // NaN
console.log(Math.min(...numbers)) // -6
console.log(Math.max(...numbers)) // 28
使用数组作为参数
您可以使用传播操作员将数组变成参数列表。请参阅下面的示例：
function sandwich(a, b, c) {
console.log(a); // '🍞'
console.log(b); // '🥬'
console.log(c); // '🥓'
}
const food = ['🍞', '🥬', '🥓'];
// Old way
sandwich.apply(null, food);
// ✅ ES6 way
sandwich(...food);
将项目添加到列表中
传播操作员可以将项目添加到另一个阵列中，具有自然，易于理解的语法：
const numbers = [1, 2, 3, 4]
const moreNumbers = [...numbers, 5, 6, 7, 8]
console.log(moreNumbers) // Array(8) [1, 2, 3, 4, 5, 6, 7, 8]
组合对象
观看传播操作员如何结合这两个对象：
const myVehicle = {
brand: 'Ford',
model: 'Mustang',
color: 'red'
}
const updateMyVehicle = {
type: 'car',
year: 2021,
color: 'yellow'
}
const myUpdatedVehicle = {...myVehicle, ...updateMyVehicle}
请注意，不匹配的属性是合并的，但是确实匹配的属性
color被最后通过的对象覆盖了updateMyVehicle。产生的颜色现在为黄色。
结论
ES6的出现不仅使JavaScript更加高效，而且还会引入诸如传播操作员和其他人之类的酷功能。以下是我在写作开始时答应的策划文章清单。