ES10 之 Destructuring 与 Rest Parameters
ES10，即 ECMAScript 2019，是 JavaScript 的最新版本之一。它引入了一些新特性，其中包括 Destructuring 和 Rest Parameters。这两个特性都是优化了 JavaScript 开发，使代码更加简洁和易于维护。
Destructuring
Destructuring（解构赋值）是一种用于从数组或对象中提取值的语法。它可以帮助开发者更快速、更简洁地访问数组或对象的属性和元素。下面是一个数组解构示例：
const arr = [1, 2, 3]; const [a, b, c] = arr; console.log(a, b, c); // 1 2 3
上面的代码中，我们用 const 声明了一个名为 arr 的数组变量，并将其中的元素解构给了三个新变量 a、b 和 c。这使得我们可以更方便地访问该数组中的值。
对象解构同样可以使代码更简洁易读，示例如下：
const person = {
name: 'John',
age: 25,
location: 'New York'
};
const {name, age, location} = person;
console.log(name, age, location); // John 25 New York上面的代码中，我们首先声明了一个名为 person 的对象，并从中解构出了三个属性 name、age 和 location。
Destructuring 不仅用于简化代码，还可用于快速赋值和使用函数的多个返回值。例如：
-- -------------------- ---- -------
-------- ----------- -
------ -
----- -------
---- ---
--------- ---- -----
--
-
----- ------ ---- --------- - ------------
----------------- ---- ---------- -- ---- -- --- ----上面的代码中，我们定义了一个 getPerson 函数，并从函数的返回值中解构出了三个属性，与前面的对象解构示例类似。
Rest Parameters
Rest Parameters（剩余参数）是一种语法，使函数能够接受任意数量的参数，并将这些参数组合成一个数组。这在处理需要不固定参数数量的函数时非常有用。例如：
function sum(...numbers) {
return numbers.reduce((total, current) => total + current);
}
console.log(sum(1, 2, 3, 4, 5)); // 15上面的代码中，我们定义一个名为 sum 的函数，并使用 Rest Parameters 语法来接受任意数量的参数。在函数体中，将参数组成的数组传递给 reduce 方法来计算它们的总和。
Rest Parameters 还可以与 Destructuring 一起使用。例如：
function fullName(first, last, ...titles) {
return `${first} ${last} ${titles.join(' ')}`;
}
console.log(fullName('John', 'Doe', 'Jr.', 'PhD')); // John Doe Jr. PhD上面的代码中，我们定义了一个名为 fullName 的函数，其中接受了三个参数，以及 Rest Parameters 语法中的任意数量的 titles。在函数体中，我们使用 join 方法将 titles 组成字符串。
总结
Destructuring 和 Rest Parameters 都是非常有用的语法，它们可以使代码更加简洁清晰，并使开发者更加高效。同时，这种语法也可以让代码更加易于维护，并减少出错的可能性。
前端开发者应当熟练掌握 Destructuring 和 Rest Parameters 的用法，并且将它们应用到实际项目中。只有不断实践和尝试，在实际中应用，才能更好的掌握它们的用法和使用技巧。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a8101448841e98944ad9eb