- 数组的解构
解构数组的方法:
const arr = [100, 200, 300];
const [one, two, three] = arr;
console.log(one);
console.log(two);
console.log(three);
如果只想解构其中的某些元素:
const [, , mo] = arr;
console.log(mo);
- [ ] 构造矩阵
表示提取从当前位置(foo)往后的所有成员,只能在解构的最后一个位置使用,并且以数组的形式返回结果
const [foo, ...rest] = arr;
console.log(rest);
如果解构位置的成员个数小于被解构的数组长度,那么就会按照从前到后的顺序去提取
const [foo] = arr;
console.log(foo);//100
反之,如果结构位置的成员个数大于被解构的数组长度,那么就会返回undefined
const [foo,bar,vaz,more] = arr;
console.log(more);//undefined
如同访问数组中一个不存在的下标
如果没有查询到元素的值,那么就会返回默认值;如果能查询到,那就还是返回原值
const [foo,bar,baz = 123,more = 'default value'] = arr;
console.log(bar,more);//200 default value
值得注意的是:
[,rootdir]//解构的是最后一个
[rootdir,]//解构的是第一个
应用场景:
拆分字符串
const path = '/foo/bar/baz';
const [, rootdir] = path.split('/');
console.log(rootdir); //baz
- 对象的解构
大部分性质和数组的解构差不多,但唯独注意一点
当外面定义的变量和对象里的属性名重名时,应该采取这种方法去解决:
const obj = {name:'zce',age:18};
const {name} = obj;
console.log(name);//zce
const name = 'tom';
const {name :objName} = obj;
console.log(objName);
应用场景:(简化代码体积)
const {log} = console;
log('foo');
log('bar');
log('123');