初识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中的回调函数就是拿到结果(通常是异步结果)
   其它待补充