ECMAScript 2019 中的 Rest 和 Spread 运算符-JavaScript中文网-JavaScript教程资源分享门户

在 ECMAScript 2019 中，Rest 和 Spread 运算符是两个重要的新功能。它们可以帮助前端开发人员更好地处理参数和数据，提供了更灵活和强大的功能。

Rest 运算符：将参数打包

Rest 运算符通常用于函数的参数列表中，它会将多个参数打包成一个数组。在以往，我们一般使用 arguments 对象来处理此类情况，但它并不是一个真正的数组，使用起来不够方便。

下面是 Rest 运算符的语法：

function myFunction(...args) {
  // args 为打包后的数组
}

下面是一个实例：

function myFunction(...args) {
  console.log(args); // ["hello", "world"]
}

myFunction("hello", "world");

在这个例子中，我们将两个参数传递给 myFunction，Rest 运算符将其打包成一个数组，并通过 console.log 打印出来。

Rest 运算符也可以与其他参数一起使用，但必须是最后一个参数。

function myFunction(x, y, ...args) {
  // args 为打包后的数组
}

Spread 运算符：展开数据

Spread 运算符的作用相反，它会将一个数组或对象展开成单独的参数。这使得我们可以更方便地传递函数参数或创建新的数组和对象。

下面是 Spread 运算符的语法：

myFunction(...args)

下面是一个实例：

const myArray1 = [1, 2, 3];
const myArray2 = [4, 5, 6];

const newArray = [...myArray1, ...myArray2];
console.log(newArray); // [1, 2, 3, 4, 5, 6]

在这个例子中，我们使用 Spread 运算符将 myArray1 和 myArray2 展开，并将它们连接成一个新数组 newArray。

同样地，Spread 运算符也可以用于对象中：

const myObject1 = {a: 1, b: 2};
const myObject2 = {c: 3, d: 4};

const newObject = {...myObject1, ...myObject2};
console.log(newObject); // {a: 1, b: 2, c: 3, d: 4}

这里我们将 myObject1 和 myObject2 展开，并将它们合并成一个新对象 newObject。

总结

Rest 和 Spread 运算符是 ECMAScript 2019 中的两个重要新功能，它们可以帮助我们更好地处理参数和数据，提供了更灵活和强大的功能。在函数参数列表中，Rest 运算符可以将多个参数打包成一个数组；而 Spread 运算符则可以将一个数组或对象展开成单独的参数。这些功能可以在函数传递和数组或对象合并的情况下提供更有效的解决方案。

参考链接

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