ES9 中新的 Rest/Spread 语法的老朋友-JavaScript中文网-JavaScript教程资源分享门户

ES9 中新的 Rest/Spread 语法的老朋友

在 JavaScript 中，我们经常会遇到需要使用数组或对象中的某些部分的情况。在 ES6 中，我们已经学会了如何使用解构来获取数组和对象中的部分内容。但是在 ES9 中，我们有了一种新的方式来获取数组和对象中的部分内容——Rest/Spread 语法。

Rest 语法用于获取数组（array）和对象（object）中的剩余部分，而 Spread 语法用于将数组（array）和对象（object）展开成独立的值。

下面让我们来详细介绍一下这两种语法的使用方法。

Rest 语法

Rest 语法在函数中使用时非常实用，它允许我们获取所有传递给函数的参数并将剩余部分保存到一个数组中。例如，假设我们有一个函数 divide，它将接收两个数字作为参数并返回它们的商。我们可以使用 Rest 语法来允许函数接收多个参数：

-- -------------------- ---- -------
-------- ------------------ -
  --- ------ - -----------
  --- ---- - - -- - - --------------- ---- -
    ------ -- -----------
  -
  ------ -------
-

---------------------- -- ---- -- -- -

上面的代码中，Rest 语法允许我们在函数参数中使用 ...numbers 来获取传递给函数的所有参数并将它们保存到一个数组中。

除了函数参数之外，Rest 语法还可以在数组和对象的定义中使用。例如，我们可以使用 Rest 语法来获取除第一个元素之外的所有元素：

const numbers = [1, 2, 3, 4, 5];
const [first, ...rest] = numbers;

console.log(first); // 等于 1
console.log(rest); // 等于 [2, 3, 4, 5]

上面的代码中，我们使用 ...rest 来获取除第一个元素之外的所有元素，并将它们保存在一个数组中。

Spread 语法

Spread 语法是一种用于展开数组和对象的语法，它允许我们将一个数组或对象展开成独立的值。例如，假设我们有两个数组，我们想将它们连接在一起。我们可以使用 Spread 语法来实现：

const firstArray = [1, 2, 3];
const secondArray = [4, 5, 6];
const combinedArray = [...firstArray, ...secondArray];

console.log(combinedArray); // 等于 [1, 2, 3, 4, 5, 6]

上面的代码中，我们使用 ...firstArray 和 ...secondArray 来展开两个数组，并将它们连接在一起。

除了数组之外，Spread 语法还可以在对象字面量中使用。例如，我们可以使用 Spread 语法来将一个对象的属性复制到另一个对象中：

const firstObject = { a: 1, b: 2 };
const secondObject = { ...firstObject, c: 3 };

console.log(secondObject); // 等于 { a: 1, b: 2, c: 3 }

上面的代码中，我们使用 Spread 语法来复制 firstObject 对象中的属性到 secondObject 对象中。

总结

在本文中，我们详细介绍了 ES9 中的 Rest/Spread 语法，并提供了使用这两种语法的示例代码。Rest 语法允许我们获取函数参数、数组和对象中的剩余部分，而 Spread 语法允许我们展开数组和对象并将它们转换成独立的值。这两种语法可以让我们更方便地处理 JavaScript 中的数据，从而提高我们的代码效率。希望这篇文章对你有所帮助。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/6453432a968c7c53b07b5b85