2018/2/2 19:00:19当前位置推荐好文程序员浏览文章

1 Await/Async

前端的回调时代我没有赶上,我赶上的是await/async时代。
await和async基于promise实现。
先是用法,普通函数外加async,需要异步操作的那个地方写await。
就像这样:

async function doSomething() {  await doThing1();   await doThing2(); }

其实await基于doThing1()返回了一个promise,当然这个promise也不用我们过多的关注,把它理解成一个关键字就好。
这个和同步的写法已经非常非常像了。

那么问题来了,把async和await去掉,好像也是一样啊!

答:这个就涉及到浏览器的事件循环了,感兴趣的可以去看看。那我就先说一下去掉会是什么后果吧:卡,浏览器不在响应。等doThing1(),doThing2()这两个函数结束后才不卡。

2 箭头函数

这个箭头函数有什么用呢?偷懒就省事了~

//一个参数的函数写成箭头函数:function fun(a){ return 2a }//等价于:a=> a2//多个参数:function fun(a,b){ return ab }//等价于:(a,b)=> ab//没有参数()=> "没有就没有,谁怕谁"

返回值是个什么情况?能不能写多几行的函数?

如果你的函数只有一句,默认返回那一句的结果,如果有多句,要用扩号扩起来,再加return 。

那对象也是加{},多行函数也是加{},要返回这样的{[,,,]}对象怎么办?

返回对象加()就完事了,同时{}还是需要的。

()=>({[1,2]})

请重视: 关于箭头函数中this的问题

箭头函数的this指向在定义它时就已经确定了!而不是执行时的对象, 定义它的时候,可能环境是window。

var a=6;var b={ example: ()=>a}var c={        a:4,        f:function () {            console.log( b.example());          } }  c.f();

猜猜结果是多少?没错,就是 6!!!!!!!!

3 参数解构

定义时:

let [x,y]=[1,2];//x=1,y=2let obj={x:1,y:2}; let {x,y}=obj;//x=1,y=1//默认值let obj2={i:1}; let {i=3,j=3}=obj2;//i=1,y=3//复杂一点的let obj={x:1,a:[2,3]};let {x=1,a:[y,z]}=obj;//x=1,y=2,z=3

传参时的参数解构

正好之前的博文(我自己写的)中有,我就复制过来吧 。
注意increment后的参数

//未用参数解构actions: {    increment (context) {      context.commit(increment)    }  }//使用参数解构actions: {  increment ({ commit }) {    commit(increment)  }}

举个例子:{ blowUp } = { blowUp: 10 }; 结果:{blowUp:10}
从blowUp中取一个叫blowUp的属性。
参数本来是传过来的context,从context中取一个commit的东西,得到 { commit : context.commit };
挺另人头大的。

网友评论