ECMAScript 2019发布了许多新功能，其中之一是解构赋值。解构赋值可以让你从对象或数组中提取数据，并将其赋给变量。这篇文章将详解如何使用解构赋值，并给出一些示例代码。
对象解构赋值
对象解构赋值可以让你从一个对象中提取属性，然后将它们的值分配给变量。下面是一个例子：
----- ------ - - ----- ------- ---- -- -- ----- - ----- --- - - ------- ------------------ -- ---- ----------------- -- --
在这个例子中，我们创建了一个名为 person 的对象，并使用对象解构来创建 name 和 age 变量，这两个变量分别赋值为 person 对象中对应的属性的值。我们还可以给变量指定不同的名字：
----- ------ - - ----- ------- ---- -- -- ----- - ----- ---------- ---- ----- - - ------- ----------------------- -- ---- ------------------- -- --
在这个例子中，我们指定了 name 对应的变量名为 firstName，而 age 对应的变量名为 years。
我们还可以使用默认值来避免变量没有被赋值的情况：
----- ------ - - ----- ------ -- ----- - ----- --- - -- - - ------- ------------------ -- ---- ----------------- -- --
在这个例子中，我们给 age 指定了一个默认值为 30，如果 person 对象中没有 age 属性，则 age 变量将被赋值为默认值。
数组解构赋值
数组解构赋值类似于对象解构赋值，但是它可以让你从一个数组中提取元素，并将它们的值分配给变量。下面是一个例子：
----- ------- - --- -- --- ----- --- -- -- - -------- --------------- -- - --------------- -- - --------------- -- -
在这个例子中，我们创建了一个名为 numbers 的数组，并使用数组解构来创建三个变量 a、b 和 c，这三个变量分别赋值为 numbers 数组中对应的元素的值。
我们还可以忽略某些元素：
----- ------- - --- -- -- --- ----- --- - -- -- - -------- --------------- -- - --------------- -- - --------------- -- -
在这个例子中，我们忽略了 numbers 数组中的第二个元素，也就是 2。
我们还可以使用默认值：
----- ------- - --- --- ----- --- -- - - -- - -------- --------------- -- - --------------- -- - --------------- -- -
在这个例子中，我们给 c 指定了一个默认值为 3，如果 numbers 数组中没有第三个元素，则 c 变量将被赋值为默认值。
嵌套解构赋值
对象和数组可以相互嵌套，我们也可以使用嵌套解构赋值来处理它们。下面是一个例子：
----- ------ - - ----- ------- ---- --- -------- - ----- ---- ------ -------- ----- - -- ----- - ----- ---- -------- - ----- ------- - - - ------- ------------------ -- ---- ----------------- -- -- ------------------ -- --- ---- --------------------- -- ---
在这个例子中，我们创建了一个名为 person 的对象，并使用嵌套解构来创建 name、age、city 和 country 四个变量。我们还使用了别名 address 来访问嵌套对象。
操作符 ... 和剩余参数
操作符 ... 可以让你将数组或对象的剩余部分赋值给一个变量。下面是一个例子：
----- ------- - --- -- -- --- ----- --- -- -------- - -------- --------------- -- - --------------- -- - ------------------ -- --- --
在这个例子中，我们使用 ...rest 将 numbers 数组中剩余的部分赋值给了 rest 变量。
我们还可以在对象中使用剩余参数：
----- ------ - - ----- ------- ---- --- -------- - ----- ---- ------ -------- ----- - -- ----- - ----- ------- - - ------- ------------------ -- ---- ------------------ -- - ---- --- -------- - ----- ---- ------ -------- ----- - -
在这个例子中，我们使用 ...rest 将 person 对象中除了 name 属性以外的部分赋值给了 rest 变量。
结论
解构赋值是 ECMAScript 2019 新增的功能之一，可以让你从对象或数组中提取数据，并将其赋给变量。本文详细介绍了如何使用解构赋值，并给出了一些示例代码，希望可以对你学习和使用 JavaScript 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/66fb599644713626015bb717