同步与异步
js是单线程语言,单线程就是一次只能完成一个任务。
如果有多个任务就需要排队,如果一个任务排队事件太长,就会导致阻塞。
这个时候就需要异步操作
同步即阻塞,异步即非阻塞
异步可以不是顺序执行,异步任务有一个或多个回调函数。
比较常见的异步有setTimeOut和setInterVal,他们可以改变任务执行顺序
什么是promise
Promise对象用于表示一个异步操作的最终完成(或失败)及其结果值promise的使用 链式调用 我们可以用promise.then(),promise.catch()和promise.finally()这些方法将进一步的操作与一个变为已敲定状态的promise关联起来。
【关于promise学习】一个Promise必然处于一下三种状态之一:
待定(pending):初始状态,既没有被兑现,也没有被拒绝
已兑现(fulfilled):意味着操作兑现完成
已拒绝(rejected): 意味着操作失败
这些方法还会返回一个新生成的promise对象,这个对象可以被非强制性的用来做链式调用
const promiseA = new Promise((resolut,reject)=>{
resolut(777)
});
setTimeout(() => {
console.log(promiseB,'promiseB');
}, 1000);
promiseA.then(resolut => {
console.log(resolut,'resolut1');
return 111
}).then(resolut => {
console.log(resolut,'resolut2');
return 222
}).then(resolut => {
console.log(resolut,'resolut3');
throw new Error('error')
}).catch(()=>{
console.log('promiseA失败');
})
结果
// 777 'resolut1'
// 111 'resolut2'
// 222 'resolut3'
// promiseB失败
静态方法 Promise.all(iterable) 这个方法会返回一个新的Promise对象,常被用来处理多个Promise对象的状态集合。该promise对象在iterable参数对象里所有的promise都成功的时候才会触发成功,一旦有任何一个promise对象失败则立即触发失败。
Promise.allSettled(iterable) 等到所有promises都已敲定(settled)(每个promise都已兑现(fulfilled)或已拒绝(rejected))。
返回一个promise,该promise在所有promise完成后完成。并带有一个对象数组,每个对象对应每个promise的结果。
Promise.any(iterable) 接收一个Promise对象的集合,当其中的一个 promise 成功,就返回那个成功的promise的值。
Promise.race(iterable) 接收一个Promise对象的集合,当其中的一个 promise 成功或者失败,就返回那个的promise的值。
const promiseA = new Promise((resolut,reject)=>{
resolut(777)
});
const promiseB = new Promise((resolut,reject)=>{
resolut(888)
});
const promiseC = new Promise((resolut,reject)=>{
resolut(999)
});
Promise.all([promiseA,promiseB,promiseC]).then(res =>{
console.log(res);
})
// [777, 888, 999]
Promise.allSettled([promiseA,promiseB,promiseC]).then(res =>{
console.log(res);
})Promise.any([promiseA,promiseB,promiseC]).then(res =>{
console.log(res);
})
// 777
Promise.race([promiseA,promiseB,promiseC]).then(res =>{
console.log(res);
})
// 777
参考:
https://zhuanlan.zhihu.com/p/...
https://developer.mozilla.org...
推荐阅读
- 【JS30-Wes Bos】30天原生JS挑战——总结
- 【JS30-Wes Bos】自定义视频播放器 11
- Day 33/100 JavaScript 创建对象的四种方式
- 【JS30-Wes Bos】HTML5 画板 06
- 27个精美的时间线(含源代码)
- 【JS30-Wes Bos】异步操作实现的小字典
- 获取数组嵌套深度
- 数组去重的一些方法
- JavaScript语言基础