ES6的解构赋值实例详解

这次给大家带来的是ES6的解构赋值实例详解，我们知道ES6是非常强大的，这篇文章就给大家好好分析一下。

基本用法

let [x, y, ...z] = ['a']
//"a", undefined, []

1.等号右边如果不是数组，将会报错（不是可遍历结构）
2.解构赋值 var, let, const命令声明均适用
3.set结构也可解构赋值(具有Iterator接口，可采用数组形式结构赋值)

set解构:任何类型的单个值的集合

let [x, y, z] = new Set(["a", "b", "c"])
x //"a"

默认值

1.数组成员的值不严格等于undefined，默认值不生效(null的话相应值依然为null)

[x=1, y=2, z=3, o=4] = ['a', , undefined, null]
//"a", 2, 3, null、

2.如果默认值是表达式，表达式惰性求值，只有在用到的时候才会去执行

3.默认值可以引用结构赋值的其他变量，但该变量必须已声明

对象结构赋值

1.数组按次序排列，对象变量必须与属性同名

var {bar, foo, baz: loc} = {foo: 'aaa', baz: 'bbb'}
bar //undefined
foo //"aaa"
loc //"bbb"
baz //ReferenceError: baz is not defined

2.变量以前声明过，使用let赋值会报错

3.可用于嵌套结构的对象

var node = {
  loc: {
    start: {
      line: 1,
      column: 5
    }
  }
}
var {loc:{start:{line}}} = node
line //1
loc //ReferenceError: loc is not defined
start //ReferenceError: start is not defined

line是变量，loc,start都是模式

相信看了以上介绍你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

相关阅读：

横向不间断滚动效果代码

JS引擎运行时是什么样的

JS的使用过程中如何自定义console对象

以上就是ES6的解构赋值实例详解的详细内容，更多请关注php中文网其它相关文章！