promise知识点以及使用场景,带上例子,更清晰

我们先来看一个例子,来了解一下promise使用场景

 function funA(callback) {
	console.log("A");
	setTimeout(() = > {
		callback()
	}, 100)
}

function funB() {
	console.log("B")
}

function funC(callback) {
	console.log("C")
	setTimeout(() = > {
		callback()
	}, 1000)
}

function funD() {
	console.log("D")
}

function funE() {
	console.log("E")
}

Function funF() {
	console.log("F")
}

funA(()=>{
funB()
funC(()=>{
funD()
})
funE()
})
funF()

简单易懂的例子

我走到快餐店的柜台前,点了一个起士汉堡。并交了1.47美元的现金。通过点餐和付款,我为得到一个 值(起士汉堡)制造了一个请求。我发起了一个事务。
  但是通常来说,起士汉堡不会立即到我手中。收银员交给一些东西代替我的起士汉堡:一个带有点餐排队号的收据。这个点餐号是一个“我欠你”的许诺(Promise),它保证我最终会得到我的起士汉堡。
  于是我就拿着我的收据和点餐号。我知道它代表我的 未来的起士汉堡,所以我无需再担心它——除了挨饿!
  在我等待的时候,我可以做其他的事情,比如给我的朋友发微信说,“嘿,一块儿吃午餐吗?我要吃起士汉堡”。
  我已经在用我的 未来的起士汉堡 进行推理了,即便它还没有到我手中。我的大脑可以这么做是因为它将点餐号作为起士汉堡的占位符号。这个占位符号实质上使这个值 与时间无关。它是一个 未来的值。
  最终,我听到,“113号!”。于是我愉快地拿着收据走回柜台前。我把收据递给收银员,拿回我的起士汉堡。 换句话说,一旦我的 未来的值 准备好,我就用我的许诺值换回值本身。
  但还有另外一种可能的输出。它们叫我的号,但当我去取起士汉堡时,收银员遗憾地告诉我,“对不起,看起来我们的起士汉堡卖光了。”把这种场景下顾客有多沮丧放在一边,我们可以看到 未来的值 的一个重要性质:它们既可以表示成功也可以表示失败。
  每次我点起士汉堡时,我都知道我要么最终得到一个起士汉堡,要么得到起士汉堡卖光的坏消息,并且不得不考虑中午吃点儿别的东西。
  我由等待汉堡变成了等到或者等不到,这个过程不可逆。
  
看完这个例子有没有了解了一点promise的应用场景
  
promise的知识点

executor是带有 resolve 和 reject 两个参数的函数 。Promise构造函数执行时立即调用executor 函数, resolve 和 reject 两个函数作为参数传递给executor(executor 函数在Promise构造函数返回新建对象前被调用)。resolve 和 reject 函数被调用时,分别将promise的状态改为fulfilled(完成)或rejected(失败)。executor 内部通常会执行一些异步操作,一旦完成,可以调用resolve函数来将promise状态改成fulfilled,或者在发生错误时将它的状态改为rejected。
如果在executor函数中抛出一个错误,那么该promise 状态为rejected。executor函数的返回值被忽略。

executor函数    :new Promise((resolve, reject) => {
            reject(1);  // rejected 
        })

new Promise((resolve, reject) => {
            reject(1);  
        })
        .then((fullfilled) => {
            console.log(fullfilled);
        }, (rejected) => {
            console.log(rejected, '2-1');   
        })
        
        .then((fullfilled) => {
            console.log(fullfilled, '3-1');  
        }, (rejected) => {
            console.log(rejected, '3-2');
        })

        .then((fullfilled) => {
            console.log(fullfilled, '4-1');
            return Promise.reject(5);             
        }, (rejected) => {
            console.log(rejected, '5-1');
        })

        .catch((error) => {
            console.log(error, '6-1');   
        })

        .then(fullfilled => {
            console.log(fullfilled, '7-1'); 
        }, rejected => {
            console.log(rejected, '7-2');
        })
		

上面例子的结果欢迎在评论区探讨

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值