介紹下promise的特性,優缺點,內部如何實現的,動手實現一個promise (一)


1.Promise 基本特性

  • 1. Promise有三種狀態:pending(進行中),fulfilled(resolve)(已成功),reject(已失敗).
  • 2. Promise對象接受一個回調函數作為參數,該回調函數接受兩個參數,分別是成功時的回調resolve和失敗時的回調reject;另外resolve的參數除了正常值以外還可能時一個promise對象的實例;reject的參數通常時一個error對象的實例;
  • 3 then方法放回一個新的Promise實例,並接收兩個參數onResolve(fulfilled狀態的回調);onRejected(reject狀態的回調,該參數可選)
  • 4.catch方法返回一個新的promise實例
  • 5. finally方法不管Promise狀態如何都會執行,該方法的回調函數不接受任何參數。
  • 6. Promise。all()方法將多個Promise實例,包裝成一個新的Promise實例,該方法接受一個由promise對象組成的數組作為參數(Promise.all方法的參數可以不是數組,但必須具有Iterator接口,且返回的每個成員都是promise實例),注意參數中只要有一個實例觸發catch,都會觸發,Promise.all方法返回的新catch方法,如果參數中的某個實例本身調用了catch方法,將不會觸發Promise.all放回的新實例的catch方法。
  • 7. Promise.race()方法的參數與Promise.all方法一樣,參數中的實例只要有一個率先改變狀態就會將該實例的狀態傳給Promise.race方法,並將返回值作為Promise。race()方法產生的Promise實例的放回值。
  • 8.Promise.resolve()將現有對象轉為Promise對象,如果該方法的參數為一個Promise對象,Promise.resolve將不做任何處理;如果將參數thenable對象(即具有then方法),Promise.resolve()將該對象轉換為Promise對象並立即執行then方法,如果參數是一個原始值,或者是一個不具有then方法的對象,則Promise.resolve方法返回一個新的Promise對象,狀態為fulfilled,其參數將會將會作為then方法中onresolved回調函數的參數,如果Promise。resolve方法不帶參數,會直接放回一個fulfilled的狀態的Promise對象。需要注意的是,立即resolve()的promise對象,是在本輪“事件循環”,(event loop)的結束時執行,而不是在下一輪“事件循環中”的開始時。
  • 9. Promise.reject()同樣放回一個新的promise對象,狀態為rejected,無論傳入任何參數都將作為reject()的參數。

2)Promise優點

  • 1.統一異步api
  • Promise的一個重要有優點是它將逐漸被用作瀏覽器的異步API,統一現在各種各樣的API,以及不兼容的模式和手法。
  • 2.Promise 與事件對比
  • 和事件相比較,Promise更適合處理一次性的結果,在結果計算出來之前或之后注冊回調函數都是可以的,都可以拿到正確的值,Promise的這個優點和自然,但是,不能使用Promise處理多次觸發事件,鏈式處理Promise的有一有點,但是事件卻不能這樣鏈式處理
  • 3.Promise 與回調對比。
  •   解決了回調地獄的問題,將異步操作以同步操作的流程表達出來
  • 4.Promise帶來的額外好處時包含了更好的錯誤處理方式(包含已成處理),並且寫起來很輕松(以為可以寵用一些同步的工具比如Array.prototype.map()).

3)Promise 缺點

  • 1.無法取消Promise,一旦新建他就會立即執行,無法中途取消
  • 2.如果不設置回調函數,Promise內部拋出的錯誤,不會放映到外部 。
  • 3.當處於Pending狀態時,無法得知promise進展到哪一個階段(剛剛開始還是即將完成)
  • 4.Promise真正執行回調的時候,定義Promise那部分實際上已經走完了,所以Promise的報錯堆棧上下午不太友好

4.簡單代碼實現Promise有7個主要的屬性state(狀態),value(成功放回值),reason(錯誤信息),resolve方法,reject方法,then方法。

 //1.實際Promise
        //new Promise((resolve,reject)=>{ resolve("zhangpanpan")}))
        //實現簡易版Promise
        class MyPromise {
            constructor(exccutor) {
                this.state = "pending"; //當前執行的狀態
                this.value;  //正確或錯誤情況下的放回值
                //resolvue 保存正確情況下的返回值
                let resolvue = value => {
                    if (this.state === "pending") {
                        this.state = "fulfilled";
                        this.value = value;
                    }
                }
                //reject 情況執行 的函數
                let reject = value => {
                    if (this.state === "pending") {
                        this.state = "rejected";
                        this.value = value;
                    }
                }
                try {
                    exccutor(resolvue, reject)
                } catch (error) {
                    reject(error)
                }
            }
            then(onfulfilled, onJected) {
                if (this.state === "rejected") {
                    onJected(this.value)
                }
                if(this.state === "fulfilled"){
                    onfulfilled(this.value)
                }
            }
        }
        let mypromise=new MyPromise((res,rej)=>{
            res("ddd")
        });
        mypromise.then(e=>{
            console.log(e);
        })
      

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM