實現一個類Pormise

核心代碼

爲了精簡代碼，下面的Promise實現中去掉了代碼校驗，這樣方便小夥伴看到Promise的核心邏輯。ES6語法。

活很少說，直接放代碼

class PromiseTest {
    executor = (resolve, reject) => {
    }

    constructor(executor) {
        this.executor = executor;
    }

    then(sucess, error) {
        let flag = true;
        let resolveV;
        let rejectV;
        const resolve = (value) => {
            flag = true;
            resolveV =  sucess(value);
        };
        const reject = (value) => {
            flag = false;
            rejectV = error(value);
        };
        this.executor(resolve, reject);
        // onfulfilled onrejected返回參數的傳遞  這是promise的精髓😀
        return new PromiseTest((resolveSub, rejectSub) => {
            if (flag) {
                resolveSub(resolveV);
            } else {
                rejectSub(rejectV);
            }
        });
    }
}

有沒有很簡單，下面對照最典型的實用方法非小夥伴講解一些這個簡單的代碼。

代碼測試和代碼講解

const promise = new PromiseTest(function(resolve, reject) {
 if (true){
    resolve("sucess");
  } else {
    reject("erorr");
  }
});

promise.then(function (value) {
    console.log(value)    // => sucess
    return "sub " + value;
}, function (error) {
    console.log(error)    // => erorr
    return "sub " + error;
}).then(function (value) {
    console.log(value)  // => sub sucess
}, function (error) {
    console.log(error)  // => sub erorr 
});  
// 回調函數的返回值是能夠傳遞的下一個then回調函數裏面，這樣能夠像元promise同樣無限傳遞下去😀

簡單的概括一下，Promise構建的時候把你傳入的executor(resolve, reject){}函數緩存到返回的promise對象中，當你調用promise的then方法的時候，就是執行你寫的executor(resolve, reject){}函數，並then方法中定義的兩個回調函數替換替換到構建Promise時定義的executor(resolve, reject){}中的兩個入參。

固然promise不會像我說的這麼簡單，可是核心原理就是這個樣的。