初识JS中的异步和回调

先举个例子

var n=0
function doSomething(){
    console.log('开始')
  var id=setInterval(()=>{
    n++
    console.log('在interval内循环')
    if(n>=10){
      window.clearInterval(id)
      console.log('interval循环完毕')
    }
  },1)
}
function doNext(){
  console.log('执行下一条')
}
doSomething()
doNext()
控制台结果
  • 这里引出一个疑问:
    明明doNext()在doSomething()之后,但是doNext()内的console.log(执行下一条)确执行在(开始)之后.
    这是为什么呢?---是因为setInterval触发了JS中的异步执行顺序.它让doSomething()里的内容还没做完,就开始执行doNext()了.
  • 这里都doNext()并不知道doSomething()执行完没有.所以引出了js中的另一个知识点--回调函数.

将上述代码修改为:


var n=0
function doSomething(fn){// 传入另一个函数
    console.log('开始')
  var id=setInterval(()=>{
    n++
    console.log('在interval内循环')
    if(n>=10){
      window.clearInterval(id)
      console.log('interval循环完毕')
      fn.call()  //也可fn(),结束时再调用传入的函数
    }
  },1)
}
function doNext(){
  console.log('执行下一条')
}

doSomething(doNext)//将doNext作为参数传入

控制台结果

这样就能通过回调函数(callback)来让告诉doNext(),doSomething()已经执行完了.
打个比方,下面的A就是同步,而B不包括括号内的部分就是异步,括号内的内容就是回调


  • 总结:
  1. js中的异步就是不等结果就执行下一步.
  2. js中的回调函数就是拿到结果(通常是异步结果)
    其它待补充
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容