什么是解构赋值？
在 ES6 中，我们可以使用解构赋值来方便地将数组或对象中的值取出，赋值给变量。比如：
-- -------------------- ---- ------- ----- --- - --- -- --- ----- --- -- -- - ---- -------------- -- - -------------- -- - -------------- -- - ----- --- - - ----- ----- ---- -- -- ----- ------ ---- - ---- ------------------ -- -- ----------------- -- --展开代码
解构赋值的新特性：对象匹配模式
在 ES7 中，解构赋值又新增了一种模式：对象匹配模式。这种模式可以让我们方便地在解构对象时，只取出我们需要的属性，而不用管对象中还有其他的属性。
对象匹配模式的语法如下：
const obj = { name: '张三', age: 18, sex: '男' }; const {name, age} = { ...obj }; console.log(name); // 张三 console.log(age); // 18 console.log(sex); // 报错：sex is not defined
通过对象匹配模式，我们可以将 obj 对象中的 name 和 age 属性取出并分别赋值给 name 和 age 变量，而不用担心 obj 中还有其他的属性。
应用场景
对象匹配模式最常用的场景是在函数参数中使用。比如写一个函数，接收一个对象作为参数：
function getUserInfo(userInfo) { const {name, age} = userInfo; console.log(`姓名：${name}，年龄：${age}`); }
上面的代码中，我们在函数内部使用对象匹配模式来取出 userInfo 中的 name 和 age 属性，然后输出到控制台。使用这种方式，我们可以只取出我们需要的属性，而不用管对象中还有其他的属性。
当然，我们也可以在函数参数中直接使用对象匹配模式：
function getUserInfo({name, age}) { console.log(`姓名：${name}，年龄：${age}`); }
这样就可以省去在函数内部再解构一遍的过程。
注意事项
在使用对象匹配模式时，需要注意以下几点：
- 你需要使用
...操作符来将对象展开，才能使用对象匹配模式。 - 属性名称必须与解构赋值的变量名称相同，否则会报错。
- 如果对象中没有要解构的属性，会将变量赋值为
undefined。
结语
对象匹配模式可以方便地取出对象中我们需要的属性，省去了对其他属性的担心。在函数参数中使用对象匹配模式，能够使代码更加简洁易懂。但是在使用过程中也需要注意一些细节问题。希望本文对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6781a459935627c900e2777c
