首先,要明白什么是异步,什么是同步;这就好比排队买电影票,异步就像有多个窗口多个队同时进行购票,同步就像只有一个窗口一个队进行购票。在js中setTimeout和setInterval函数就是最基础的异步,可以改变程序正常执行顺序。
那么怎么解决异步呢?
一、回调函数
概念:一个函数B被作为参数传递到另一个函数A,然后被调用执行的过程(即A函数执行后在执行B函数)
例:
function fun(callback){
setTimeout(()=>{
callback(5)
},2000)
}
fun((data)=>{
console.log(data) // 程序结果为 5
})
回调函数是解决异步编程最基本的方法,其优点是简单、容易理解和部署,缺点是不利于代码的阅读和维护,各个部分之间高度耦合(Coupling),流程会很混乱,而且每个任务只能指定一个回调函数。
二、promise方法解决异步
1、promise对象是commonJS工作组提出的一种规范,一种模式,目的是为了异步编程提供统一接口。
2、promise是一种模式,promise可以帮忙管理异步方式返回的代码。他讲代码进行封装并添加一个类似于事件处理的管理层。我们可以使用promise来注册代码,这些代码会在在promise成功或者失败后运行。
3、promise完成状态分成两类:1、解决(resolved);2、拒绝(rejected)。
4、promise解决(resolved):意味着顺利结束。promise拒绝(rejected)意味着没有顺利结束。
例:
function fun(){
return new Promise((resolve)=>{ //resolve 成功时执行的回调函数
setTimeout(()=>{
var c = 6
resolve(c)
},2000)
})
}
fun().then((data)=>{
console.log(data)
}).catch(()=>{
//处理错误
})
这样写的优点:回调函数写成了链式写法,程序的流程可以看得很清楚,而且有一整套的配套方法,可以实现很多强大的功能。
三、优雅的async/await方法
这种方法是基于promise进行处理异步的,书写如下:
function fun(){
return new Promise((resolve)=>{ //resolve 成功时执行的回调函数
setTimeout(()=>{
var c = 6
resolve(c)
},2000)
})
}
async function test(){
var data = await fun(); //await 跟的值一定要是promise
console.log(data);
}
test();
最后,对于异步程序执行,有好有坏,处理异步我们也应该按需使用。