Promise in JavaScript
通过下面代码来初步了解下promise
- Promise是一个构造函数,它接收一个回调函数,这个回调函数有两个argument,resolve和reject
- Promise保存了一个异步处理的结果,可能是resolve,也可能是reject
- 通过then,catch,finally,all等api去处理异步处理结果,实现链式调用
故事1
有一天小明的妈妈下班回到家,发现家里被小明弄得乱七八糟,满地垃圾,小明见妈妈很生气,就Promise(承诺/保证)在十分钟之内把房间打扫干净。
let promiseToCleanTheRoom = new Promise(function (resolve, reject) {
//小明正在努力打扫房间
//cleaning the room
let isClean = true;
//无论成功还是失败,小明得勇敢的说出来
if(isClean){
resolve('Clean')
} else{
reject('not Clean')
}
})
// 十分钟后妈妈来检查 小明承诺 的结果
promiseToCleanTheRoom.then(function (fromResolve) {
//从resolve中 获取了 打扫干净 成功的消息
console.log('the room is' + fromResolve)
}).catch(function (fromReject) {
//从reject中 获取了 打扫干净 失败的消息
console.log('the room is' + fromReject)
})
故事2
小明一家三口国庆旅游回到家中,发现家里满是灰尘,妈妈就对小明说:“小明,如果你在十分钟内把房间打扫干净,并且把垃圾处理了,我就给你买一个冰淇淋吃”
// 任务1 打扫房间
let cleanRoom = function() {
return new Promise(function(resolve, reject) {
resolve('Clean the Room' + '\n')
})
}
// 任务2 清理垃圾
let removelGarbage = function(message) {
return new Promise(function(resolve, reject) {
resolve(message + 'Romove the garbage' + '\n')
})
}
// 任务3 获取冰淇淋奖励
let winIcecream = function(message) {
return new Promise(function(resolve, reject) {
resolve(message + 'won a icecream' + '\n')
})
}
cleanRoom()
.then((fromResolve) => {
return removelGarbage(fromResolve)
})
.then((fromResolve) => {
return winIcecream(fromResolve)
})
.then((fromResolve) => {
console.log(fromResolve)
})
// --------------****Promise.all()和Promise.race()***-------------
//promise chain all resolved
Promise.all([cleanRoom(),removelGarbage(),winIcecream()]).then(()=>{
console.log('all finished')
})
//one of promise chain resolved
Promise.race([cleanRoom(),removelGarbage(),winIcecream()]).then(()=>{
console.log('one of them is finished')
})
通过上述两个例子,你会发现,通过promise处理异步,代码会变得很干净,回调嵌套也变得简单明了,只有当上一个回调处理完了,我才能根据返回的消息,执行下一次回调,基本上解决了回调地狱的问题