成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

【js】what is Promise和手寫實(shí)現(xiàn)簡(jiǎn)易版Promise

LMou / 842人閱讀

摘要：有三種狀態(tài)，等待中，已完成，已失敗。對(duì)象狀態(tài)不受外界影響，只有異步操作的結(jié)果可以改變狀態(tài)，這就是的由來(lái)怎么用接受一個(gè)函數(shù)作為參數(shù)，這個(gè)參數(shù)函數(shù)的兩個(gè)參數(shù)分別是和，用來(lái)執(zhí)行了兩種狀態(tài)的回調(diào)函數(shù)。當(dāng)實(shí)例生成后，用方法來(lái)指定兩種狀態(tài)的回調(diào)函數(shù)。

什么是Promise

官方的解釋：Promise是一個(gè)用來(lái)傳遞異步操作消息的對(duì)象。
Promise有三種狀態(tài)，pending（等待中），resolved（已完成），rejected（已失?。?。對(duì)象狀態(tài)不受外界影響，只有異步操作的結(jié)果可以改變狀態(tài)，這就是“promise“的由來(lái)

怎么用Promise

Promise接受一個(gè)函數(shù)作為參數(shù)，這個(gè)參數(shù)函數(shù)的兩個(gè)參數(shù)分別是resolved和rejected，用來(lái)執(zhí)行了兩種狀態(tài)的回調(diào)函數(shù)。
當(dāng)Promise實(shí)例生成后，用then方法來(lái)指定兩種狀態(tài)的回調(diào)函數(shù)。舉一個(gè)簡(jiǎn)單例子

//axios是一個(gè)基于Promise的http請(qǐng)求，可以直接調(diào)用then

this.axios.get(url).then((res)=>{
        //請(qǐng)求成功 resolved的回調(diào)
    },(err)=>{
        //請(qǐng)求失敗 rejected的回調(diào)
    }）
}）
將多個(gè)Promise封裝成一個(gè)

假如你需要等待多個(gè)Promise請(qǐng)求resoved后在執(zhí)行，可以調(diào)用Promise.all()
這個(gè)api接受一個(gè)promise實(shí)例數(shù)組做參數(shù)。

手動(dòng)實(shí)現(xiàn)Promise 
//1.定義三種狀態(tài)
const PENDING = "pending"
const RESOLVED = "resolved"
const REJECTED = "rejected"
function MyPromisr(fn){
       //重命名this，防止接下來(lái)找不到正確的this
       const that = this
       that.state = PENDING //初始狀態(tài)為等待
       that.value = null //value用于保存resolved或rejoiced傳入的值
       that.resolvedCallbacks = [] //成功請(qǐng)求后的回調(diào)數(shù)組
       //定義完成的回調(diào)函數(shù)
       function resolved(value) {
            // 只有在等待狀態(tài)才可以改變狀態(tài)
            if (that.state === PENDING) {
                that.state = RESOLVED
                that.value = value
                that.resolvedCallbacks.map(cb => cb(that.value))
            }
        }
        //定義拒絕的回調(diào)函數(shù)
        function rejected(value) {
            // 只有在等待狀態(tài)才可以改變狀態(tài)
            if (that.state === PENDING) {
                that.state = REJECTED
                that.value = value
                that.rejectedCallbacks.map(cb => cb(that.value))
            }
        }
        // 定義了兩種狀態(tài)的回調(diào)函數(shù)后,執(zhí)行mypromise傳參的函數(shù)
        try {
            fn(resolved,rejected)
        } catch (e) {
            rejected(e)
        }
}
// 定義then
MyPromise.prototype.then = function(onFulfilled,onRejected){
    const that = this
    onFulfilled = typeof onFulfilled === "function" ? onFulfilled :v => v
    onRejected = 
     typeof onRejected === "function"
        ? onRejected
        : r => {
            throw r
        }
    if (that.state === PENDING) {
        that.resolvedCallbacks.push(onFulfilled)
        that.rejectedCallbacks.push(onRejected)
    }
    if (that.state === RESOLVED) {
        onFulfilled(that.value)
    }
    // console.log(that.state,"has change")
    if (that.state === REJECTED) {
        onRejected(that.value)
    }
}

//調(diào)用
new MyPromise((resolved,rejected) => {
    setTimeout(()=>{
        resolved(1)
        rejected(2)
    },0)
}).then(value=>{
    console.log(value)
},value=>{
    console.log(value)
})

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/105210.html

相關(guān)文章

  • JavaScript之手寫Promise

    摘要：如果狀態(tài)是等待態(tài)的話，就往回調(diào)函數(shù)中函數(shù)，比如如下代碼就會(huì)進(jìn)入等待態(tài)的邏輯以上就是簡(jiǎn)單版實(shí)現(xiàn)實(shí)現(xiàn)一個(gè)符合規(guī)范的接下來(lái)大部分代碼都是根據(jù)規(guī)范去實(shí)現(xiàn)的。 為更好的理解， 推薦閱讀Promise/A+ 規(guī)范 實(shí)現(xiàn)一個(gè)簡(jiǎn)易版 Promise 在完成符合 Promise/A+ 規(guī)范的代碼之前，我們可以先來(lái)實(shí)現(xiàn)一個(gè)簡(jiǎn)易版 Promise，因?yàn)樵诿嬖囍校绻隳軐?shí)現(xiàn)出一個(gè)簡(jiǎn)易版的 Promise ...

    stefan 評(píng)論0 收藏0

  • 22道JavaScript高頻手寫面試題

    JavaScript筆試部分 點(diǎn)擊關(guān)注本公眾號(hào)獲取文檔最新更新,并可以領(lǐng)取配套于本指南的 《前端面試手冊(cè)》 以及最標(biāo)準(zhǔn)的簡(jiǎn)歷模板. 實(shí)現(xiàn)防抖函數(shù)（debounce） 防抖函數(shù)原理：在事件被觸發(fā)n秒后再執(zhí)行回調(diào)，如果在這n秒內(nèi)又被觸發(fā)，則重新計(jì)時(shí)。 那么與節(jié)流函數(shù)的區(qū)別直接看這個(gè)動(dòng)畫實(shí)現(xiàn)即可。 showImg(https://segmentfault.com/img/remote/146000002...

    Alan 評(píng)論0 收藏0

  • 3行代碼實(shí)現(xiàn)一個(gè)簡(jiǎn)易版promise

    前言 作為一個(gè)后端過(guò)來(lái)的同學(xué),剛?cè)腴T前端的時(shí)候,被js種種「反人類」的概念折騰的死去活來(lái)的.其中一個(gè)印象比較深刻的,就是promise,感覺實(shí)在太難理解了...所有就有了寫個(gè)簡(jiǎn)單的promise的想法.希望能幫助到一些跟我一樣,感覺promise很難理解的新同學(xué). promise的教程網(wǎng)上多如牛毛,其中寫的比較通俗易懂的莫過(guò)于阮一峰的es6,反正我是他的書才懂的.所以今天,我們也不會(huì)來(lái)復(fù)述一遍如何...

    ralap 評(píng)論0 收藏0

  • 「中高級(jí)前端面試」JavaScript手寫代碼無(wú)敵秘籍

    摘要：第一種直接調(diào)用避免在不必要的情況下使用，是一個(gè)危險(xiǎn)的函數(shù)，他執(zhí)行的代碼擁有著執(zhí)行者的權(quán)利。來(lái)自于此外，實(shí)現(xiàn)需要考慮實(shí)例化后對(duì)原型鏈的影響。函數(shù)柯里化的主要作用和特點(diǎn)就是參數(shù)復(fù)用提前返回和延遲執(zhí)行。手寫路徑導(dǎo)航 實(shí)現(xiàn)一個(gè)new操作符 實(shí)現(xiàn)一個(gè)JSON.stringify 實(shí)現(xiàn)一個(gè)JSON.parse 實(shí)現(xiàn)一個(gè)call或 apply 實(shí)現(xiàn)一個(gè)Function.bind 實(shí)現(xiàn)一個(gè)繼承 實(shí)現(xiàn)一個(gè)J...

    Zhuxy 評(píng)論0 收藏0

  • What's New in JavaScript

    摘要：在和中都保留了數(shù)組的強(qiáng)引用，所以在中簡(jiǎn)單的清除變量?jī)?nèi)存并沒有得到釋放，因?yàn)檫€存在引用計(jì)數(shù)。而在中，它的鍵是弱引用，不計(jì)入引用計(jì)數(shù)中，所以當(dāng)被清除之后，數(shù)組會(huì)因?yàn)橐糜?jì)數(shù)為而被回收掉。其實(shí)我們主要注意的引用是不計(jì)引用計(jì)數(shù)的，就好理解了。 showImg(https://segmentfault.com/img/remote/1460000019147368?w=900&h=383); 前...

    cgh1999520 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

LMou

男|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<