这次给大家带来es6解构有哪些方法，es6解构的注意事项有哪些，下面就是实战案例，一起来看一下。
如果要将一个已经声明的变量用于解构赋值，必须非常小心。
// 错误的写法let x;{x} = {x: 1};// SyntaxError: syntax error
登录后复制
上面代码的写法会报错，因为 JavaScript 引擎会将{x}理解成一个代码块，从而发生语法错误。只有不将大括号写在行首，避免 JavaScript 将其解释为代码块，才能解决这个问题。
// 正确的写法let x;({x} = {x: 1});
登录后复制
如果变量名与属性名不一致，必须写成下面这样。
var { foo: baz } = { foo: 'aaa', bar: 'bbb' };baz // "aaa"let obj = { first: 'hello', last: 'world' };let { first: f, last: l } = obj;f // 'hello'l // 'world'//这实际上说明，对象的解构赋值是下面形式的简写let { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };
登录后复制
也就是说，对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量。真正被赋值的是后者，而不是前者。
let { foo: baz } = { foo: "aaa", bar: "bbb" };baz // "aaa"foo // error: foo is not defined
登录后复制
let obj = { p: [ 'Hello', { y: 'World' } ]};let { p: [x, { y }] } = obj;x // "Hello"y // "World"
登录后复制
注意：这时p是模式，不是变量，因此不会被赋值。如果p也要作为变量赋值，可以写成下面这样。
let obj = { p: [ 'Hello', { y: 'World' } ]};let { p, p: [x, { y }] } = obj;x // "Hello"y // "World"p // ["Hello", {y: "World"}]
登录后复制
解构赋值时，如果等号右边是数值和布尔值，则会先转为对象
let {toString: s} = 123;s === Number.prototype.toString // truelet {toString: s} = true;s === Boolean.prototype.toString // true
登录后复制
函数的参数也可以使用解构赋值。
function add([x, y]){ return x + y;}add([1, 2]); // 3
登录后复制
上面代码中，函数add的参数表面上是一个数组，但在传入参数的那一刻，数组参数就被解构成变量x和y。对于函数内部的代码来说，它们能感受到的参数就是x和y
undefined就会触发函数参数的默认值。
相信看了本文案例你已经掌握了方法，更多精彩请关注【创想鸟】其它相关文章！
推荐阅读：
html标签与dom节点结合
js禁止浏览器后退事件
以上就是es6解构有哪些方法的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2770868.html
