木灵鱼儿
阅读:1721
es6 解构笔记
es6的解构,解构的是一个对象才行,如果不是对象,则先把右边的内容转成对象再进行解构。
数组和对象的解构比较简单,这里就不多说了,主要讲讲另外几个对象类型的解构:
string类型的解构
解构一段文本内容,文本内容会被转换成类似数组的对象。
let [a,b,c] = "one";
console.log(a); // o
console.log(b); // n
console.log(c); // e
数值和布尔类型的转换
这两个和字符不同,他们的转换后不是数组,而是一个继承了Number或者Boolean的所有方法的对象,可以尝试理解为是一个继承了他们类型的所有方法的一个对象,比如:Number("123")
那么解构的思路就要按照对象解构的方式去使用:
Num和布尔对象都有一个toString()
的方法
let {toString:n} = 123;
//n就可以获取到Number对象的toString方法。
console.log(n === Number.prototype.toString); //true
let {toString:n} = true;
//n就可以获取到Boolean对象的toString方法。
console.log(n === Boolean.prototype.toString); //true
undefined和null
这两个无法转换为对象,所以解构的时候,会报类型错误
let {prop:x} = undefined; //TypeError
let {prop:y} = null; //TypeError
函数的参数解构
函数的参数支持解构,因为他的参数支持传入一个对象,那么可以解构这个参数。
具体方法就不写了,和数组或者对象的解构方式一样。
圆括号的使用
解构虽然很方便,但是他有一个致命的缺陷,就是,一行代码,如果要理解这行代码是解构,那么就要识别到=
等于符号的时候才能知道这是一个解构。
那么如果解构中出现了圆括号又怎么处理呢?
es6的规则就是,只要是导致解构有歧义的,就不得使用圆括号。
但是这条规则不怎么明确,所以不怎么容易辨别,所以一般建议就是,能不用圆括号就不用。
关于圆括号的一些避免,我总结出一点,非常好用,
变量声明中不能使用圆括包裹将要被赋值的变量名
//报错
let [(a)] = [1];
//没有问题
[(a)] = [1];
也就是说,let,var,这些创建的变量的时候,不要用圆括号去包裹创建的元素名,而且尽量不要去使用。
而且函数里面的参数,他其实也等于一个变量声明,所以也不能使用圆括号。
解构的用途
除了在创建对象变量的时候,或者JSON对象的时候,还可以用在js的模块引入上。
一般来说我们如果在一个js文件里书写了多个方法作为一个模块,最后都要导出为一个对象,然后一般的引用做法可能是遍历出所有的导出对象,然后一个个激活。
通过解构的方式,我们可以快速的获取到某一个指定的方法:
const {local,sesiSion} = require("storage.js");
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
相关推荐
关于es6 解构报错的一些经验
es6的解构非常好用,可以省去很多代码。为此我测试了一些场景的错误没有对应的keyconst {data} = {datas:"文本"};这种情况下,有值,但是key无法解析,那么就会返回undefined,也就是data输出是个undefined没有值const {data} =null;这种情况就会报错,这个报错会停止js的运行,所以我们需要用try--catch捕获key对应的值为nullconst {data} ={datas:null};这种情况也不会报错,他会把null拿到综合情况const {data,test} ={datas:null};这种情况并不...