Js异步处理

关于js的异步,自认为还是比较清楚的,虽然在自己的小项目中没有遇到过异步问题,或者说是被自己不想解决麻烦而躲避过去了。但是当遇到异步,需要去处理时,才发现,真的是略知一二。记录一下,以防哪天又忘记怎么处理了~

  • 回调函数 (callback)
基本网上对于回调的讲解都是回调是一个函数被作为一个参数传递到另一个函数里,在那个函数执行完后再执行。( 也即:B函数被作为参数传递到A函数里,在A函数执行完后再执行B )。
通俗来说,就是在一个函数执行完毕后,得到想要的特定数据后在去执行的函数
- 例子
getdata(callback){
    //这里我们假设是从后端获取数据
    setTimeout(function(){
     //假设我们获取到数据info
     var info = {
      "id":0,
      "name":'zxw'
     }
     //得到数据以后执行函数方法
     callback(info)//这个就是回调函数
},1000)
check(data){
  if(data.id==1){
   console.log('验证成功,可以通过')
  }
}
getdata(check)
  • async await
    之前在我处理异步的时候,我期望的是使用async await去解决。
    也就是

    async check(){
    	let info = await getInfo(); // getInfo()为一个异步请求
    	// .........
    	console.log(info)
    } 
    

    然而结果并不是我期望的先执行getInfo()并拿到其返回值赋给info。而是还是依然先创建了info没有赋值,打印了 underfined。猜测的愿意是getInfo()中的函数的为题。
    查询了资料发现,

    • async 告诉程序这是一个异步,awiat 会暂停执行async中的代码,等待await 表达式后面的结果,跳过async 函数,继续执行后面代码
    • async 函数会返回一个Promise 对象,那么当 async 函数返回一个值时,Promise 的 resolve 方法会负责传递这个值;当 async 函数抛出异常时,Promise 的 reject 方法也会传递这个异常值
    • await 操作符用于等待一个Promise 对象,并且返回 Promise 对象的处理结果(成功把resolve 函数参数作为await 表达式的值),如果等待的不是 Promise 对象,则用 Promise.resolve(xx) 转化

    所以说我那个地方的问题就是因为我那个异步函数并不是一个Promise对象,自己也没有把它转为一个Promise,所以就undefined了。

  • promise
    promise其实源码看看就很容易使用了

下去得把async await的源码看看学习学习,相对于上面三种处理异步的,个人还是偏向与async await。目前还没有发现async awiat的坑在哪里,所以才会偏向async await吧

参考文档:

关于js中的回调函数callback
JS回调函数深入篇
阮一峰 promise
promise源码
async函数

你可能感兴趣的:(js学习)