在 ECMAScript 2019 中，JavaScript 引入了许多新的特性，其中解构赋值被认为是最重要的一个。解构赋值是指从数组或对象中提取值，然后将这些值赋给变量。这不仅让代码更加简洁易读，还能提高开发效率。在本文中，我们将详细介绍解构赋值，并提供一些示例代码来帮助你快速上手。
什么是解构赋值
解构赋值是一种将数组或对象解构为各个变量的方式。它可以让你一次性提取多个值，并将它们赋值给变量。这样就不用一个一个地去定义变量并赋值了。下面是一个简单的例子：
-- -------------------- ---- ------- -- ---- ----- --- -- -- - --- -- --- --------------- -- - --------------- -- - --------------- -- - -- ---- ----- - -- - - - - -- -- -- - -- --------------- -- - --------------- -- -
在这个例子中，我们使用了方括号和大括号来分别表示数组和对象的解构。在数组解构中，我们用方括号 [] 包裹变量名，并同时为这些变量赋值。在对象解构中，我们用大括号 {} 包裹变量名，同时指定要提取的属性。
解构默认值
有时候，我们可能想要为变量指定默认值。在解构赋值中，如果某个变量没有被解构到任何值，那么它就会被赋值为 undefined。不过，我们也可以为这些变量指定默认值，这样就能保证即使没有解构到值，这些变量也会被赋予默认值。下面是一个简单的例子：
-- -------------------- ---- ------- ----- -- - -- - - -- - - -- - --- - --- --------------- -- - --------------- -- - --------------- -- - ----- - - - -- - - -- - - - - - - -- -- -- - -- --------------- -- - --------------- -- - --------------- -- -
在这个例子中，我们使用了等号 = 来指定默认值。当变量没有被解构到值时，就会使用默认值来赋值。在数组解构中，我们使用了逗号，来跳过第二个元素。在对象解构中，我们没有为 y 指定值，所以它会被赋值为默认值 2。
解构嵌套对象和数组
在解构赋值中，我们也可以嵌套解构数组和对象。这样就能从嵌套的结构中提取出所需的值。下面是一个嵌套解构的例子：
-- -------------------- ---- -------
----- ---- - -
----- ------
---- ---
---- -
------ ---- -----------
------- ----
--
------- -------------- -------- ------- ------- ------
--
----- -
-----
----
---- - ------ ------ --
------- -------- - -------
- - -----
------------------ -- -----
----------------- -- --
------------------- -- ---- ----------
-------------------- -- ----
-------------------- -- ------------
-------------------- -- ------在这个例子中，我们使用了嵌套解构来从 user 对象中提取值。在 job 中，我们提取了 title 和 salary。在 skills 中，我们只提取了数组的第一个元素和第三个元素，而第二个元素则被跳过了。
用解构赋值交换变量值
在 JavaScript 中，我们经常需要交换变量的值。在传统的方式中，我们需要创建一个临时变量来存储其中一个值。不过，使用解构赋值，我们可以更简单地交换变量的值。下面是一个例子：
let a = 1; let b = 2; [a, b] = [b, a]; console.log(a); // 2 console.log(b); // 1
在这个例子中，我们使用了解构赋值来交换变量 a 和 b 的值。这是因为我们使用了方括号来解构数组，然后交换了两个变量的位置。
结论
在 ECMAScript 2019 中，解构赋值是一个非常有用的特性，使用它可以让我们更简单、更易读地操作数组和对象。我们不仅可以从数组和对象中提取值，还可以指定默认值、嵌套解构、交换变量值等操作。你可以在你的日常开发中使用解构赋值，来精简你的代码，并提高你的效率。
参考资料
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672c0832ddd3a70eb6d43723