在 ES6 中，我们已经学会了如何使用解构赋值来从对象或数组中提取数据。ES9 中引入了一些新的特性来进一步增强解构赋值的能力，让我们能够更方便地进行变量的赋值、重命名以及使用默认值等操作。本文将会详细介绍 JavaScript 中 ES9 的解构赋值的新特性，并提供一些示例代码及其实际应用。
可选的 catch 绑定
在 ES6 中，我们通过在 catch 块中定义一个变量来捕获异常：
try {
// some code
} catch (e) {
// handle the exception
}然而，如果我们不需要使用该异常对象，也需要为其定义一个形式参数，这种语法看起来很臃肿。ES9 中，我们可以使用可选的 catch 绑定来避免这种情况，只需省略异常的形式参数即可：
try {
// some code
} catch {
// handle the exception
}对象属性的 rest 和 spread 运算符
在 ES6 中，我们已经可以使用解构赋值来提取对象属性：
const { name, age } = user;然而，如果我们需要将除了某些特定属性之外的所有属性都提取出来，我们可以使用 rest 运算符：
const { name, age, ...rest } = user;这里，rest 变量将会包括除 name 和 age 之外的所有属性。相反，我们也可以使用 spread 运算符将一个对象拆分到另一个对象中：
const userCopy = { ...user };这里，userCopy 变量将包含所有 user 对象的属性。
数组元素的 rest 和 spread 运算符
除了对象属性外，我们也可以使用 rest 和 spread 运算符来操作数组元素。比如，提取数组中除第一个元素之外的所有元素：
const [first, ...rest] = myArray;
这里，first 变量将指向 myArray 中的第一个元素，而 rest 变量将包括其余的元素。我们也可以将一个数组拆分到另一个数组中：
const newArray = [...myArray];
这里，newArray 将包含 myArray 中的所有元素。
解构赋值时的默认值
在 ES6 中，我们可以对解构赋值过程中未定义的属性使用默认值：
const { name, age = 18 } = user;如果 user 对象中不存在 age 属性，age 变量将被赋值为默认值 18。ES9 中，我们可以在数组解构赋值中同样使用默认值：
const [first, second, third = 3] = myArray;
这里，如果 myArray 中不足三个元素，third 变量将被赋值为默认值 3。
对象属性的动态名称
在 ES6 中，我们只能使用固定的属性名称来定义变量:
const { name, age } = user;ES9 中，我们可以使用表达式来定义属性名称：
const obj = { ['first' + 'Name']: 'John' };这里，对象 obj 将包含一个 firstName 属性，在运行时动态地生成属性名称。
在函数参数中使用解构赋值
最后，我们可以在函数参数中使用解构赋值，以提取函数调用的参数。比如，我们可以将前面提到的对象属性和数组元素的 rest 和 spread 运算符应用到函数参数中：
function myFunction({ name, age }) {
// do something with name and age
}
function anotherFunction(first, ...rest) {
// do something with first and rest
}这里，当我们调用 myFunction({ name: 'John', age: 30 }) 时，函数将会提取出调用参数中的 name 和 age 属性。类似地，调用 anotherFunction(1, 2, 3) 时，函数将会提取出第一个参数 1，以及其余的元素 2 和 3。
总结
在本文中，我们详细介绍了 JavaScript 中 ES9 的解构赋值的新特性，包括可选的 catch 绑定、对象属性和数组元素的 rest 和 spread 运算符、解构赋值时的默认值、对象属性的动态名称以及在函数参数中使用解构赋值等。这些新特性可以使我们更方便地进行变量赋值、重命名、默认值设定以及函数参数传递等操作，从而大大提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645b65bc968c7c53b0dbd420