ES7 中关于解构赋值对象匹配的新特性及应用

阅读时长 3 分钟读完

什么是解构赋值?

在 ES6 中,我们可以使用解构赋值来方便地将数组或对象中的值取出,赋值给变量。比如:

-- -------------------- ---- -------
----- --- - --- -- ---
----- --- -- -- - ----
-------------- -- -
-------------- -- -
-------------- -- -

----- --- - - ----- ----- ---- -- --
----- ------ ---- - ----
------------------ -- --
----------------- -- --
展开代码

解构赋值的新特性:对象匹配模式

在 ES7 中,解构赋值又新增了一种模式:对象匹配模式。这种模式可以让我们方便地在解构对象时,只取出我们需要的属性,而不用管对象中还有其他的属性。

对象匹配模式的语法如下:

通过对象匹配模式,我们可以将 obj 对象中的 nameage 属性取出并分别赋值给 nameage 变量,而不用担心 obj 中还有其他的属性。

应用场景

对象匹配模式最常用的场景是在函数参数中使用。比如写一个函数,接收一个对象作为参数:

上面的代码中,我们在函数内部使用对象匹配模式来取出 userInfo 中的 nameage 属性,然后输出到控制台。使用这种方式,我们可以只取出我们需要的属性,而不用管对象中还有其他的属性。

当然,我们也可以在函数参数中直接使用对象匹配模式:

这样就可以省去在函数内部再解构一遍的过程。

注意事项

在使用对象匹配模式时,需要注意以下几点:

  1. 你需要使用 ... 操作符来将对象展开,才能使用对象匹配模式。
  2. 属性名称必须与解构赋值的变量名称相同,否则会报错。
  3. 如果对象中没有要解构的属性,会将变量赋值为 undefined

结语

对象匹配模式可以方便地取出对象中我们需要的属性,省去了对其他属性的担心。在函数参数中使用对象匹配模式,能够使代码更加简洁易懂。但是在使用过程中也需要注意一些细节问题。希望本文对你有所帮助。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6781a459935627c900e2777c

纠错
反馈

纠错反馈