Promise 有没有解决异步问题
Promise 对象是 JavaScript 的异步操作解决方案,为异步操作提供统一的接口。它起到代理作用(proxy),充当异步操作与回调函数之间的中介,使得异步操作具备同步操作的接口。Promise 可以让异步操作写起来,就像在写同步操作的流程,而不必一层一层的嵌套回调函数。
Promise 解决了 callback 回调地狱的问题,async await 是异步操作的终极解决方案。
来看一下 JavaScript 中异步方案
1.回调函数(callback)
setTimeout(()=>{
//callback 函数体
},1000)
缺点:回调地狱,不能用 try catch捕获错误,不能 return
回调地狱的根本问题在于:
缺乏顺序性:回调地狱导致调试困难,和大脑的思维方式不同。
嵌套函数存在耦合性,一旦有所改动,就会牵一发而动全身。
嵌套函数过多的话,很难梳理错误。
ajax('xxx1',()=>{
//callback
ajax('xxx2',()=>{
//callback2
ajax('xxx3',()=>{
//callback3
})
})
})
优点:解决了同步问题(只要有一个任务耗时很长,后面的任务就必须排队等着,会拖延整个程序的执行。)
2.Promise
Promise 就是为了解决 callback 问题而产生的。Promise 实现了链式调用,也就是说每次 then 后面返回的都是一个全新的 Promise,如果我们在 then 中 return ,return 的结果会被 Promise.resolve 包装
优点:解决了毁掉地狱的问题
ajax('xxx1')
.then(res=>{
//操作逻辑
return ajax('xxx2');
}).then(res=>{
//操作逻辑
return ajax('xxx3');
}).then(res=>{
//操作逻辑
})
缺点:无法取消 Promise ,错误需要通过回调函数来捕获
3.Generator
特点:可以控制函数的执行,可以配合 co 函数库使用
function *fetch(){
yield ajax('xxx1',()=>{});
yield ajax('xxx2',()=>{});
yield ajax('xxx3',()=>{});
}
let it = fetch();
let res1 = it.next();
let res2 = it.next();
let res3 = it.next();
4.async / await
async,await 是异步的终极解决方案
优点:代码清晰,不用像 Promise 写一大堆的 then 链,处理了回调地狱的问题
缺点:await 将异步代码改造为同步代码,如果多个异步操作没有依赖性而使用 await 会导致性能上的降低。
async function fn(){
//以下代码没有依耐性的话,完全可以使用 Promise.all 的方式
//如果有依赖性的话,其实就是解决了回调地狱的例子了
await fetch('xxx1');
await fetch('xxx2');
await fetch('xxx3');
}