在 ES6 中使用 rest 参数和展开语法-JavaScript中文网-JavaScript教程资源分享门户

什么是 rest 参数和展开语法

在 ES6 中，引入了 rest 参数和展开语法，使得在函数参数和数组/对象传递中更加方便和灵活。

rest 参数，即 "..." 加上新参数名称，可以将函数传入的所有参数转为一个数组。

展开语法，即 "..." 加上数组或对象，可以将其展开为单个元素或单个属性。

rest 参数的应用

rest 参数可以用于参数数量不确定的函数。

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

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

rest 参数也可以与其他参数一起使用，但必须放在最后。

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

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

展开语法的应用

在数组中使用展开语法，可以将一个数组展开成单个元素，或将多个数组合并成一个。

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = [...arr1, ...arr2];

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

在对象中使用展开语法，可以将一个对象展开成单个属性，或将多个对象合并成一个。

let obj1 = {name: 'Alice', age: 28};
let obj2 = {city: 'Beijing', country: 'China'};
let obj3 = {...obj1, ...obj2};

console.log(obj3);   // {name: 'Alice', age: 28, city: 'Beijing', country: 'China'}

为什么要使用 rest 参数和展开语法

使用 rest 参数和展开语法，可以写出更简洁、可读性更高的代码。

let scores = [90, 85, 95, 80];
let maxScore = Math.max(...scores);

代码中，将数组 scores 展开后，传入 Math.max() 函数中，得到最大值。

使用展开语法将多个对象合并成一个，可以方便地进行数据深拷贝。

let obj1 = {name: 'Alice', age: 28};
let obj2 = {city: 'Beijing', country: 'China'};
let obj3 = {...obj1, ...obj2};
let obj4 = {...obj3};

obj1.age = 30;
console.log(obj3);   // {name: 'Alice', age: 28, city: 'Beijing', country: 'China'}
console.log(obj4);   // {name: 'Alice', age: 28, city: 'Beijing', country: 'China'}

总结

在 ES6 中，rest 参数和展开语法是非常重要的语法，可以帮助我们更好地处理参数、数组和对象的传递。使用它们可以让代码更简洁、易读、具有高维护性。

参考资料

ECMAScript 6 入门：http://es6.ruanyifeng.com/#docs/function#rest-%E5%8F%82%E6%95%B0
JavaScript 编程精解：https://www.amazon.com/JavaScript-Programming-Exercises-Solutions-Annotated/dp/154327757X

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