ES6：promise是啥？强力一波！

2024年3月25日 203次阅读 来源: QangLee

title: ES6：相识promise
subtitle: 纪录进修到的知识点，进修阮一峰大神es6书的一些心得

回调地狱感受一下：

let target = {
    data:"callBack hell!!!",
    timeout:1000
}
let asyncFunc = function(cb,data = this.data){
    setTimeout( (dataTemp) => {
        console.log(dataTemp);
        cb();
    }, this.timeout,data);
}.bind(target);
asyncFunc(()=>{
    asyncFunc(()=>{
        asyncFunc(()=>{
            asyncFunc(()=>{
                asyncFunc(()=>{
                    asyncFunc(()=>{
                        console.log("吓人不。。。。。");
                    })
                })
            })
        })
    })
})

回调套多了，几乎没法看。。。

promise改进一波

let target = {
    data: "promise ~~",
    timeout: 1000
}
let asyncFunc = function (data = this.data) {
    var pObj = new Promise((resolve,reject) => {
        setTimeout( (dataTemp) => {
            console.log(data);
            resolve(data)
        }, this.timeout,data);
    })
    return pObj;
}.bind(target)
asyncFunc()
.then(()=>asyncFunc())
.then(()=>asyncFunc())
.then(()=>asyncFunc())
.then(()=>asyncFunc())
.then(()=>asyncFunc())
.then(()=>asyncFunc("惬意多了有无"))

promise

  • 是一种异步的解决方案，比传统的回调更合理且壮大。
  • 简朴来说就是一个容器，内里存在着某个将来发作的事宜（通常是一个异步操纵）的效果。
  • 语法上来说是一个对象，经由过程他能够获得异步操纵的信息
  • promise能够将种种异步操纵用一样的要领举行处置惩罚，由于它供应了一致的api
  • 异步操纵以同步操纵的流程表现

三种状况：

  • Pending 举行中
  • Fulfilled 已胜利
  • rejected 已失利

两个特性：

1.promise对象的状况不受外界影响</font>：只需异步操纵的效果才会决议该对象现在处于什么状况，除此以外的其他操纵都没法转变，这也是为何叫‘promise’，中文意义叫‘许诺’

2.一旦状况转变就不会再变，任何时候都能获得效果</font>：

  • promise对象的状况转变只需两种能够：Pending->Fulfilled和Pending->Rejected，
  • resolved-已定型：只需状况发作转变就会凝结，一向坚持这个效果，这时候叫做resolved

  • 厉害了：与事宜差别，当其触发了，错过再监听就得不到效果了，然则promise内部的异步函数实行完了，再去添加回调还能获得效果,示例代码：

    let pObj = new Promise((resolve,reject)=>{
    console.log("测试实行后，在添加回调是不是能够");
    let bSuccess = true;
    bSuccess ? resolve("yes") : reject("no");
})
pObj.then(res => { console.log(res) })

注重

promise对象一旦建立马上实行，上面的代码为例，不能半途作废。假如不设置reject,内部炸了，也不能通报到外层代码-mark-背面会有引见这点

resolve,reject,.then(),.catch()

`new Promise((resolve,reject)=>{
let bSuccessed = true;
if(bSuccessed){

resolve("Fulfilled");resolve("Fulfilled");

}else{

//失利
reject("Rejected");

}
}).then(res).catch(res)`

Promise的组织函数接收的参数是一个函数，这个函数中的两个参数：resolve，reject，是由js引擎供应，不需要本身设置，确切看起来有点怪,这两个参数都接收Promise对象通报出来的值作为参数

  • resolve：转变状况从 Pending -> Fulfilled
  • reject：转变状况从 Pending -> Rejected
    原文作者：QangLee
    原文地址: https://segmentfault.com/a/1190000018419605
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞