在现代的 JavaScript 编程中，以对象为基础的编程已经成为了一种非常普遍的方式。然而，在处理对象时，有时我们只需要其中的某些属性，而不是整个对象。在 ES 6 中，我们可以使用一种新的语法来更方便地获取对象的属性。
对象解构（Object Destructuring）
对象解构是一种可以让我们从对象中提取属性并将其分配给变量的语法。它使得代码更加简洁易读。这是一个基本的用法示例：
----- ------ - - ----- -------- ---- --- ------- -------- -- ----- - ----- --- - - ------- ------------------ -- ------- ----------------- -- --
上面的代码声明了一个 person 对象，并使用对象解构从中提取出 name 和 age 属性。通过使用花括号 {}，我们可以指定要提取的属性名，然后将其分配给相应的变量。
如果你想将属性赋值给不同的变量名，可以使用下面这样的语法：
----- - ----- --------- ---- -------- - - ------- ---------------------- -- ------- ---------------------- -- --
在上面的代码中，我们指定了 name 属性应该被赋值给变量 fullName，age 属性应该被赋值给变量 yearsOld。
对象解构还支持默认值。当属性的值为 undefined 时，将使用默认值。下面是一个示例：
----- - ---- - ------------ ---------- - ------------ - - --- ------------------ -- ----------- ------------------------ -- ------------
在上面的代码中，我们使用了空的对象，并指定了默认值。由于空对象没有 name 和 occupation 属性，因此它们使用了我们提供的默认值。
嵌套对象解构（Nested Object Destructuring）
如果对象的某个属性是另一个对象，那么我们可以使用嵌套对象解构来访问该属性的属性。以下是一个嵌套对象解构的示例：
----- ------ - -
----- --------
---- ---
-------- -
------- ---- ---- ----
----- ----------
------ ----
-
--
----- - ----- -------- - ---- - - - -------
------------------ -- -------
------------------ -- ---------在上面的代码中，我们通过嵌套对象解构获取了 city 属性。注意，我们必须指定 address 属性名，然后再从中获取 city 属性。
数组解构（Array Destructuring）
除了对象解构，ES 6 还引入了数组解构，它可以从数组中提取元素并将其分配给变量。以下是一个基本的用法示例：
----- ------- - --- -- --- ----- ------- ------- - -------- ------------------- -- - -------------------- -- -
在上面的代码中，我们从 numbers 数组中提取了前两个元素，并将它们分配给变量 first 和 second。
与对象解构类似，数组解构也支持默认值和嵌套解构。这里不再赘述。
结论
ES 6 中的对象解构和数组解构是 JavaScript 编程的有用工具，可以大大简化代码，提高代码质量和可读性。通过使用它们，我们可以更方便地访问对象和数组中的属性和元素。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/10742