promise 原理解析

[george-es]

promise 有三种状态 pending（进行中），fulfilled（成功），rejected（失败）

有 7 种方法

Promise.prototype.then()

Promise.all()

Promise.race()

Promise.resolve()

Promise.reject()

Promise.prototype.catch()

Promise.prototype.finally()

Promise.prototype.then()

Promise.all()

Promise.all() 用于将多个 Promise 实例，包装成一个新的 Promise 实例，子 Promise 全部完成时，触发 then

它传入一个数组，数组均为 Promise 对象，返回值也是一个数组，数组里面是结果的值

myPromise.all = function(promiseArr = []) {
	return new Promise((resolve, reject) => {
        let result = []
        let index = 0
        function addData(key, value) {
            result[key] = value
            index++
            if (index === promiseArr.length) {
                resolve(result)
                console.log(result);
            }
        }
        for (let i = 0; i < promiseArr.length; i++) {
            if (promiseArr[i] instanceof Promise) {
                promiseArr[i].then(data => {
                    addData(i, data)
                }, reason => {
                    reject(reason)
                })
            } else {
                addData(i, arr[i])
            }
        }
    })
}

Promise.race()

Promise.race() 用于将多个 Promise 实例，包装成一个新的 Promise 实例，返回最快完成的子 Promise，触发 then

它传入一个数组，数组均为 Promise 对象，返回值是一个值

myPromise.race = function(promiseArr = []) {
	return new Promise((resolve, reject) => {
		for(let i = 0; i < promiseArr.length; i++) {
			let current = promiseArr[i];
			if(current instanceof Promise) {
				current.then(resolve, reject)
			} else {
				resolve(current)
			}
		}
	})
}

测试

let promise1 = new Promise(resolve => {
    setTimeout(() => resolve(1), 1000)
})

let promise2 = new Promise(resolve => {
    setTimeout(() => resolve(2), 4000)
})

let promise3 = new Promise(resolve => {
    setTimeout(() => resolve(3), 2000)
})
myPromise.all([promise1, promise2, promise3]).then(v => console.log(v))

Promise.resolve()

将值转换成 Promise 对象，并返回 resolve 值

myPromise.resolve = function(item) {
	if(item instanceof Promise) {
		return item
	} else {
		return new Promise(resolve => resolve(item))
	}
}

Promise.reject()

将值转换成 Promise 对象，并返回 reject 值

myPromise.reject = function(item) {
	return new Promise((resolve, reject) => reject(item))
}

Promise.finally()

无论成功还是失败都要执行 finally 方法，返回一个 Promise 对象

myPromise.finally = function(callback) {
	return this.then(value => {
		return new Promise.resolve(callback()).then(() => value)
	}, reason => {
		return new Promise.resolve(callback()).then(() => throw reason)
	})
}

Promise.catch()

捕获错误方法

myPromise.catch = function(failCallback) {
	return this.then(undefined, failCallback)
}