Promise就是为了解决callback的问题而产生的。
Promise 本质上就是一个绑定了回调的对象，而不是将回调传回函数内部。
开门见山，Promise解决的是回调函数处理异步的第2个问题：控制反转。
我们把上面那个多层回调嵌套的例子用Promise的方式重构：
let getPromise1 = function () {
return new Promsie(function (resolve, reject) {
$.ajax({
url: 'XXX1',
success: function (data) {
let key = data;
resolve(key);
},
error: function (err) {
reject(err);
}
});
});
};
let getPromise2 = function (key) {
return new Promsie(function (resolve, reject) {
$.ajax({
url: 'XXX2',
data: {
key: key
},
success: function (data) {
resolve(data);
},
error: function (err) {
reject(err);
}
});
});
};
let getPromise3 = function () {
return new Promsie(function (resolve, reject) {
$.ajax({
url: 'XXX3',
success: function (data) {
resolve(data);
},
error: function (err) {
reject(err);
}
});
});
};
getPromise1()
.then(function (key) {
return getPromise2(key);
})
.then(function (data) {
return getPromise3(data);
})
.then(function (data) {
// todo
console.log('业务数据：', data);
})
.catch(function (err) {
console.log(err);
}); Promise 在一定程度上其实改善了回调函数的书写方式；另外逻辑性更明显了，将异步业务提取成单个函数，整个流程可以看到是一步步向下执行的，依赖层级也很清晰，最后需要的数据是在整个代码的最后一步获得。
所以，Promise在一定程度上解决了回调函数的书写结构问题，但回调函数依然在主流程上存在，只不过都放到了then(...)里面，和我们大脑顺序线性的思维逻辑还是有出入的。
Promise是什么，无论是ES6的Promise也好，jQuery的Promise也好，不同的库有不同的实现，但是大家遵循的都是同一套规范，所以，Promise并不指特定的某个实现，它是一种规范，是一套处理JavaScript异步的机制。
Promise的规范会多，如Promise/A、Promise/B、Promise/D以及Promise/A的升级版Promise/A+，其中ES6遵循Promise/A+规范，有关Promise/A+，你可以参考一下：
这里只简要介绍下几点与接下来内容相关的规范：
首先，我们看一下Promise的简单使用：
var p = new Promise(function(resolve, reject) {
// Do an async task async task and then...
if(/* good condition */) {
resolve('Success!');
}
else {
reject('Failure!');
}
});
p.then(function() {
/* do something with the result */
}).catch(function() {
/* error :( */
})我们通过这种使用构建Promise实现的第一个版本
function MyPromise(callback) {
var _this = this
_this.value = void 0 // Promise的值
var onResolvedCallbacks // Promise resolve回调函数
var onRejectedCallback // Promise reject回调函数
// resolve 处理函数
_this.resolve = function (value) {
onResolvedCallbacks()
}
// reject 处理函数
_this.reject = function (error) {
onRejectedCallback()
}
callback(_this.resolve, _this.reject) // 执行callback并传入相应的参数
}
// 添加 then 方法
MyPromise.prototype.then = function(resolve, reject) {}大致框架已经出来了，但我们看到Promise状态、reslove函数、reject函数以及then等都没有处理。
首先，举个例子：
new Promise(function (resolve, reject) {
setTimeout(function () {
var a=1;
resolve(a);
}, 1000);
}).then(function (res) {
console.log(res);
return new Promise(function (resolve, reject) {
setTimeout(function () {
var b=2;
resolve(b);
}, 1000);
})
}).then(function (res) {
console.log(res);
return new Promise(function (resolve, reject) {
setTimeout(function () {
var c=3
resolve(c);
}, 1000);
})
}).then(function (res) {
console.log(res);
})上例结果是每间隔1s打印一个数字，顺序为1、2、3。
这里保证了：
Promise一个常见的需求就是连续执行两个或者多个异步操作，这种情况下，每一个后来的操作都在前面的操作执行成功之后，带着上一步操作所返回的结果开始执行。这里用setTimeout来处理
function MyPromise(callback) {
var _this = this
_this.value = void 0 // Promise的值
// 用于保存 then 的回调， 只有当 promise
// 状态为 pending 时才会缓存，并且每个实例至多缓存一个
_this.onResolvedCallbacks = [] // Promise resolve时的回调函数集
_this.onRejectedCallbacks = [] // Promise reject时的回调函数集
_this.resolve = function (value) {
setTimeout(() => { // 异步执行
_this.onResolvedCallbacks.forEach(cb => cb())
})
} // resolve 处理函数
_this.reject = function (error) {
setTimeout(() => { // 异步执行
_this.onRejectedCallbacks.forEach(cb => cb())
})
} // reject 处理函数
callback(_this.resolve, _this.reject) // 执行callback并传入相应的参数
}
// 添加 then 方法
MyPromise.prototype.then = function() {}为了保证Promise的异步操作时的顺序执行，这里给Promise加上状态机制
// 三种状态
const PENDING = "pending"
const FULFILLED = "fulfilled"
const REJECTED = "rejected"
function MyPromise(callback) {
var _this = this
_this.currentState = PENDING // Promise当前的状态
_this.value = void 0 // Promise的值
// 用于保存 then 的回调， 只有当 promise
// 状态为 pending 时才会缓存，并且每个实例至多缓存一个
_this.onResolvedCallbacks = [] // Promise resolve时的回调函数集
_this.onRejectedCallbacks = [] // Promise reject时的回调函数集
_this.resolve = function (value) {
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = FULFILLED // 状态管理
_this.value = value
_this.onResolvedCallbacks.forEach(cb => cb())
}
})
} // resolve 处理函数
_this.reject = function (value) {
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = REJECTED // 状态管理
_this.value = value
_this.onRejectedCallbacks.forEach(cb => cb())
}
})
} // reject 处理函数
callback(_this.resolve, _this.reject) // 执行callback并传入相应的参数
}
// 添加 then 方法
MyPromise.prototype.then = function() {}每个Promise后面链接一个对象，该对象包含onresolved,onrejected,子promise三个属性.
当父Promise 状态改变完毕,执行完相应的onresolved/onrejected的时候，拿到子promise,在等待这个子promise状态改变，在执行相应的onresolved/onrejected。依次循环直到当前promise没有子promise。
// 三种状态
const PENDING = "pending"
const FULFILLED = "fulfilled"
const REJECTED = "rejected"
function MyPromise(callback) {
var _this = this
_this.currentState = PENDING // Promise当前的状态
_this.value = void 0 // Promise的值
// 用于保存 then 的回调， 只有当 promise
// 状态为 pending 时才会缓存，并且每个实例至多缓存一个
_this.onResolvedCallbacks = [] // Promise resolve时的回调函数集
_this.onRejectedCallbacks = [] // Promise reject时的回调函数集
_this.resolve = function (value) {
if (value instanceof MyPromise) {
// 如果 value 是个 MyPromise， 递归执行
return value.then(_this.resolve, _this.reject)
}
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = FULFILLED // 状态管理
_this.value = value
_this.onResolvedCallbacks.forEach(cb => cb())
}
})
} // resolve 处理函数
_this.reject = function (value) {
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = REJECTED // 状态管理
_this.value = value
_this.onRejectedCallbacks.forEach(cb => cb())
}
})
} // reject 处理函数
callback(_this.resolve, _this.reject) // 执行callback并传入相应的参数
}
// 添加 then 方法
MyPromise.prototype.then = function() {}// 三种状态
const PENDING = "pending"
const FULFILLED = "fulfilled"
const REJECTED = "rejected"
function MyPromise(callback) {
var _this = this
_this.currentState = PENDING // Promise当前的状态
_this.value = void 0 // Promise的值
// 用于保存 then 的回调， 只有当 promise
// 状态为 pending 时才会缓存，并且每个实例至多缓存一个
_this.onResolvedCallbacks = [] // Promise resolve时的回调函数集
_this.onRejectedCallbacks = [] // Promise reject时的回调函数集
_this.resolve = function (value) {
if (value instanceof MyPromise) {
// 如果 value 是个 MyPromise， 递归执行
return value.then(_this.resolve, _this.reject)
}
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = FULFILLED // 状态管理
_this.value = value
_this.onResolvedCallbacks.forEach(cb => cb())
}
})
} // resolve 处理函数
_this.reject = function (error) {
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = REJECTED // 状态管理
_this.value = value
_this.onRejectedCallbacks.forEach(cb => cb())
}
})
} // reject 处理函数
// 异常处理
// new Promise(() => throw Error('error'))
try {
callback(_this.resolve, _this.reject) // 执行callback并传入相应的参数
} catch(e) {
_this.reject(e)
}
}
// 添加 then 方法
MyPromise.prototype.then = function() {}then 方法是 Promise 的核心，这里做一下详细介绍。
promise.then(onFulfilled, onRejected)
一个 Promise 的then接受两个参数：onFulfilled和onRejected（都是可选参数，并且为函数，若不是函数将被忽略）
onFulfilled 特性：
当 Promise 执行结束后其必须被调用，其第一个参数为 promise 的终值，也就是 resolve 传过来的值
在 Promise 执行结束前不可被调用
其调用次数不可超过一次
onRejected 特性
当 Promise 被拒绝执行后其必须被调用，第一个参数为 Promise 的拒绝原因，也就是reject传过来的值
在 Promise 执行结束前不可被调用
其调用次数不可超过一次
调用时机
onFulfilled 和 onRejected 只有在执行环境堆栈仅包含平台代码时才可被调用（平台代码指引擎、环境以及 promise 的实施代码）
调用要求
onFulfilled 和 onRejected 必须被作为函数调用（即没有 this 值，在 严格模式（strict） 中，函数 this 的值为 undefined ；在非严格模式中其为全局对象。）
多次调用
then 方法可以被同一个 promise 调用多次
当 promise 成功执行时，所有 onFulfilled 需按照其注册顺序依次回调
当 promise 被拒绝执行时，所有的 onRejected 需按照其注册顺序依次回调
返回
then方法会返回一个Promise，关于这一点，Promise/A+标准并没有要求返回的这个Promise是一个新的对象，但在Promise/A标准中，明确规定了then要返回一个新的对象，目前的Promise实现中then几乎都是返回一个新的Promise(详情)对象，所以在我们的实现中，也让then返回一个新的Promise对象。
promise2 = promise1.then(onFulfilled, onRejected);
不论 promise1 被 reject 还是被 resolve ， promise2 都会被 resolve，只有出现异常时才会被 rejected。
每个Promise对象都可以在其上多次调用then方法，而每次调用then返回的Promise的状态取决于那一次调用then时传入参数的返回值，所以then不能返回this，因为then每次返回的Promise的结果都有可能不同。
如果 onFulfilled 或者 onRejected 返回一个值 x ，则运行下面的 Promise 解决过程：[[Resolve]](promise2, x)
如果 onFulfilled 或者 onRejected 抛出一个异常 e ，则 promise2 必须拒绝执行，并返回拒因 e
如果 onFulfilled 不是函数且 promise1 成功执行， promise2 必须成功执行并返回相同的值
如果 onRejected 不是函数且 promise1 拒绝执行， promise2 必须拒绝执行并返回相同的拒因
下面代码实现：
// then 方法接受两个参数，onFulfilled，onRejected，分别为Promise成功或失败的回调
MyPromise.prototype.then = function(onFulfilled, onRejected) {
var _this = this
// 规范 2.2.7，then 必须返回一个新的 promise
var promise2
// 根据规范 2.2.1 ，onFulfilled、onRejected 都是可选参数
// onFulfilled、onRejected不是函数需要忽略，同时也实现了值穿透
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value
onRejected = typeof onRejected === 'function' ? onRejected : error => {throw error}
if (_this.currentState === RESOLVED) {
return promise2 = new MyPromise(function(resolve, reject) {
})
}
if (_this.currentState === REJECTED) {
return promise2 = new MyPromise(function(resolve, reject) {
})
}
if (_this.currentState === PENDING) {
return promise2 = new MyPromise(function(resolve, reject) {
})
}
}附：值穿透解读
MyPromise.prototype.then = function (onFulfilled, onRejected) {
...
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value
onRejected = typeof onRejected === 'function' ? onRejected : error => {throw error}
...
}上面提到值穿透，值穿透即：
var promise = new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve('1')
}, 1000)
})
promise.then('2').then(console.log)最终打结果是1而不是2
再例如：
new MyPromise(resolve => resolve('1'))
.then()
.then()
.then(function foo(value) {
alert(value)
})
// output: alert 出 1通过 return this 只实现了值穿透的一种情况，其实值穿透有两种情况：
1 . promise 已经是 FULFILLED/REJECTED 时，通过 return this 实现的值穿透：
var promise = new Promise(function (resolve) {
setTimeout(() => {
resolve('1')
}, 1000)
})
promise.then(() => {
promise.then().then((res) => { // 状况A
console.log(res) // output: 1
})
promise.catch().then((res) => { // 状况B
console.log(res) // output: 1
})
console.log(promise.then() === promise.catch()) // output: true
console.log(promise.then(1) === promise.catch({name: 'anran'})) // output: true
})状况A与B处 promise 已经是 FULFILLED 了符合条件，所以执行了 return this。
注意：原生的Promise实现里并不是这样实现的，会打印出两个false
2 . promise 是 PENDING时，通过生成新的 promise 加入到父 promise 的 queue，父 promise 有值时调用 callFulfilled->doResolve 或 callRejected->doReject（因为 then/catch 传入的参数不是函数）设置子 promise 的状态和值为父 promise 的状态与值。如：
var promise = new Promise((resolve) => {
setTimeout(() => {
resolve('1')
}, 1000)
})
var a = promise.then()
a.then((res) => {
console.log(res) // output: 1
})
var b = promise.catch()
b.then((res) => {
console.log(res) // output: 1
})
console.log(a === b) // output: falsePromise 有三种状态，我们分3个if块来处理，每块都返回一个new Promise。
根据标准，我们知道，对于一下代码，promise2的值取决于then里面的返回值：
promise2 = promise1.then(function(value) {
return 1
}, function(err) {
throw new Error('error')
})如果promise1被resolve了，promise2的被1resolve，如果promise1 被reject了，promise2将被new Error('error')reject。
所以，我们需要在then里面执行onFulfilled或者onRejected，并根据返回着（标记中记为x）来确定promise2的结果，并且，如果onFulfilled/onRejected返回的是一个Promise，promise将直接取这个Promise的结果。
// then 方法接受两个参数，onFulfilled，onRejected，分别为Promise成功或失败的回调
MyPromise.prototype.then = function(onFulfilled, onRejected) {
var _this = this
// 规范 2.2.7，then 必须返回一个新的 promise
var promise2
// 根据规范 2.2.1 ，onFulfilled、onRejected 都是可选参数
// onFulfilled、onRejected不是函数需要忽略，同时也实现了值穿透
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value
onRejected = typeof onRejected === 'function' ? onRejected : error => {throw error}
if (_this.currentState === FULFILLED) {
// 如果promise1（此处为self/this）的状态已经确定并且为fulfilled，我们调用onFulfilled
// 如果考虑到有可能throw，所以我们将其包在try/catch块中
return promise2 = new MyPromise(function(resolve, reject) {
// 规范 2.2.4，保证 onFulfilled，onRjected 异步执行
// 所以用了 setTimeout 包裹下
setTimeout(function() {
try {
var x = onFulfilled(_this.value)
// 如果 onFulfilled 的返回值是一个 Promise 对象，直接取它的结果作为 promise2 的结果
if (x instanceof MyPromise) {
x.then(resolve, reject)
}
resolve(x) // 否则，以它的返回值为 promise2 的结果
} catch (err) {
reject(err) // 如果出错，以捕获到的错误作为promise2的结果
}
})
})
}
// 此处实现与FULFILLED相似，区别在使用的是onRejected而不是onFulfilled
if (_this.currentState === REJECTED) {
return promise2 = new MyPromise(function(resolve, reject) {
setTimeout(function() {
try {
var x = onRejected(_this.value)
if (x instanceof Promise){
x.then(resolve, reject)
}
} catch(err) {
reject(err)
}
})
})
}
if (_this.currentState === PENDING) {
// 如果当前的Promise还处于PENDING状态，我们并不能确定调用onFulfilled还是onRejected
// 只有等待Promise的状态确定后，再做处理
// 所以我们需要把我们的两种情况的处理逻辑做成callback放入promise1（此处即self/this）的回调数组内
// 处理逻辑和以上相似
return promise2 = new MyPromise(function(resolve, reject) {
_this.onResolvedCallbacks.push(function() {
try {
var x = onFulfilled(_this.value)
if (x instanceof MyPromise) {
x.then(resolve, reject)
}
resolve(x)
} catch(err) {
reject(err)
}
})
_this.onRejectedCallbacks.push(function() {
try {
var x = onRejected(_this.value)
if (x instanceof MyPromise) {
x.then(resolve, reject)
}
} catch (err) {
reject(err)
}
})
})
}
}// catch 的实现
MyPromise.prototype.catch = function (onRejected) {
return this.then(null, onRejected)
}至此，我们大致实现了Promise标准中所涉及到的内容。
不同的Promise实现之间需要无缝的可交互，如ES6的Promise，和我们自己实现的Promise之间以及其他的Promise实现，必须是无缝调用的。
new MyPromise(function(resolve, reject) {
setTimeout(function() {
resolve('1')
}, 1000)
}).then(function() {
return new Promise.reject('2') // ES6 的 Promise
}).then(function() {
return Q.all([ // Q 的 Promise
new MyPromise(resolve => resolve('3')) // 我们实现的Promise
new Promise.eresolve('4') // ES6 的 Promise
Q.resolve('5') // Q 的 Promise
])
})我之前实现的代码只是判断OnFullfilled/onRejected的返回值是否为我们自己实现的实例，并没有对其他类型Promise的判断，所以，上面的代码无法正常运行。
接下来，我们解决这个问题
关于不同Promise之间的交互，其实Promise/A+标准中有介绍，其中详细的指定了如何通过then的实参返回的值来决定promise2的状态，我们只需要按照标准把标准的内容转成代码即可。
即我们要把onFulfilled/onRejected的返回值x。当成是一个可能是Promise的对象，也即标准中的thenable，并以最保险的姿势调用x上的then方法，如果大家都按照标准来实现，那么不同的Promise之间就可以交互了。
而标准为了保险起见，即使x返回了一个带有then属性但不遵循Promise标准的对象（不如说这个x把它then里的两个参数都调用了，同步或者异步调用（PS，原则上then的两个参数需要异步调用，下文会讲到），或者是出错后又调用了它们，或者then根本不是一个函数），也能尽可能正确处理。
关于为何需要不同的Promise实现能够相互交互，我想原因应该是显然的，Promise并不是JS一早就有的标准，不同第三方的实现之间是并不相互知晓的，如果你使用的某一个库中封装了一个Promise实现，想象一下如果它不能跟你自己使用的Promise实现交互的场景。。。
代码实现：
// 规范 2.3
/*
resolutionProcedure函数即为根据x的值来决定promise2的状态的函数
也即标准中的[Promise Resolution Procedure](https://promisesaplus.com/#point-47)
x 为 promise2 = promise1.then(onFulfilled, onRejected)里onFulfilled/onRejected的返回值
resolve 和 reject 实际上是 promise2 的executor的两个实参，因为很难挂在其他地方，所以一并传过来。
相信各位一定可以对照标准转换成代码，这里就只标出代码在标准中对应的位置，只在必要的地方做一些解释。
*/
function resolutionProcedure(promise2, x, resolve, reject) {
// 规范 2.3.1，x 不能和 promise2 相同，避免循环引用
if (promise2 === x) {
return reject(new TypeError("Chaining cycle detected for promise!"))
}
// 规范 2.3.2
// 如果 x 为 Promise，状态为 pending 需要继续等待否则执行
if (x instanceof MyPromise) {
// 2.3.2.1 如果x为pending状态，promise必须保持pending状态，直到x为fulfilled/rejected
if (x.currentState === PENDING) {
x.then(function(value) {
// 再次调用该函数是为了确认 x resolve 的
// 参数是什么类型，如果是基本类型就再次 resolve
// 把值传给下个 then
resolutionProcedure(promise2, value, resolve, reject)
}, reject)
} else { // 但如果这个promise的状态已经确定了，那么它肯定有一个正常的值，而不是一个thenable，所以这里可以取它的状态
x.then(resolve, reject)
}
return
}
let called = false
// 规范 2.3.3，判断 x 是否为对象或函数
if (x !== null && (typeof x === "object" || typeof x === "function")) {
// 规范 2.3.3.2，如果不能取出 then，就 reject
try {
// 规范2.3.3.1 因为x.then可能是一个getter，这种情况下多次读取就有可能产生副作用
// 既要判断它的类型，又要调用它，这就是两次读取
let then = x.then
// 规范2.3.3.3，如果 then 是函数，调用 x.then
if (typeof then === "function") {
// 规范 2.3.3.3
// reject 或 reject 其中一个执行过的话，忽略其他的
then.call(
x,
y => { // 规范 2.3.3.3.1
if (called) return // 规范 2.3.3.3.3，即这三处谁先执行就以谁的结果为准
called = true
// 规范 2.3.3.3.1
return resolutionProcedure(promise2, y, resolve, reject)
},
r => {
if (called) return // 规范 2.3.3.3.3，即这三处谁先执行就以谁的结果为准
called = true
return reject(r)
}
)
} else {
// 规范 2.3.3.4
resolve(x)
}
} catch (e) { // 规范 2.3.3.2
if (called) return // 规范 2.3.3.3.3，即这三处谁先执行就以谁的结果为准
called = true
return reject(e)
}
} else {
// 规范 2.3.4，x 为基本类型
resolve(x)
}
}然后，我们使用resolutionProcedure函数替换MyPromise.prototype.then里面几处判断x是否为MyPromise对象的位置即可。即：
if (x instanceof MyPromise) {
x.then(resolve, reject)
}
// resolve(x) // 否则，以它的返回值为 promise2 的结果替换为：
resolutionProcedure(promise2, x, resolve, reject)
总共四处，不要遗漏了
// 三种状态
const PENDING = "pending"
const FULFILLED = "fulfilled"
const REJECTED = "rejected"
function MyPromise(callback) {
var _this = this
_this.currentState = PENDING // Promise当前的状态
_this.value = void 0 // Promise的值
// 用于保存 then 的回调， 只有当 promise
// 状态为 pending 时才会缓存，并且每个实例至多缓存一个
_this.onResolvedCallbacks = [] // Promise resolve时的回调函数集
_this.onRejectedCallbacks = [] // Promise reject时的回调函数集
_this.resolve = function (value) {
if (value instanceof MyPromise) {
// 如果 value 是个 Promise， 递归执行
return value.then(_this.resolve, _this.reject)
}
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = FULFILLED // 状态管理
_this.value = value
_this.onResolvedCallbacks.forEach(cb => cb())
}
})
} // resolve 处理函数
_this.reject = function (value) {
setTimeout(() => { // 异步执行，保证顺序执行
if (_this.currentState === PENDING) {
_this.currentState = REJECTED // 状态管理
_this.value = value
_this.onRejectedCallbacks.forEach(cb => cb())
}
})
} // reject 处理函数
// 异常处理
// new Promise(() => throw Error('error'))
try {
callback(_this.resolve, _this.reject) // 执行callback并传入相应的参数
} catch(e) {
_this.reject(e)
}
}
// then 方法接受两个参数，onFulfilled，onRejected，分别为Promise成功或失败的回调
MyPromise.prototype.then = function(onFulfilled, onRejected) {
var _this = this
// 规范 2.2.7，then 必须返回一个新的 promise
var promise2
// 根据规范 2.2.1 ，onFulfilled、onRejected 都是可选参数
// onFulfilled、onRejected不是函数需要忽略，同时也实现了值穿透
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value
onRejected = typeof onRejected === 'function' ? onRejected : error => {throw error}
if (_this.currentState === FULFILLED) {
// 如果promise1（此处为self/this）的状态已经确定并且为fulfilled，我们调用onFulfilled
// 如果考虑到有可能throw，所以我们将其包在try/catch块中
return promise2 = new MyPromise(function(resolve, reject) {
try {
var x = onFulfilled(_this.value)
// 如果 onFulfilled 的返回值是一个 Promise 对象，直接取它的结果作为 promise2 的结果
resolutionProcedure(promise2, x, resolve, reject)
} catch (err) {
reject(err) // 如果出错，以捕获到的错误作为promise2的结果
}
})
}
// 此处实现与FULFILLED相似，区别在使用的是onRejected而不是onFulfilled
if (_this.currentState === REJECTED) {
return promise2 = new MyPromise(function(resolve, reject) {
try {
var x = onRejected(_this.value)
resolutionProcedure(promise2, x, resolve, reject)
} catch(err) {
reject(err)
}
})
}
if (_this.currentState === PENDING) {
// 如果当前的Promise还处于PENDING状态，我们并不能确定调用onFulfilled还是onRejected
// 只有等待Promise的状态确定后，再做处理
// 所以我们需要把我们的两种情况的处理逻辑做成callback放入promise1（此处即_this/this）的回调数组内
// 处理逻辑和以上相似
return promise2 = new MyPromise(function(resolve, reject) {
_this.onResolvedCallbacks.push(function() {
try {
var x = onFulfilled(_this.value)
resolutionProcedure(promise2, x, resolve, reject)
} catch(err) {
reject(err)
}
})
_this.onRejectedCallbacks.push(function() {
try {
var x = onRejected(_this.value)
resolutionProcedure(promise2, x, resolve, reject)
} catch (err) {
reject(err)
}
})
})
}
// 规范 2.3
/*
resolutionProcedure函数即为根据x的值来决定promise2的状态的函数
也即标准中的[Promise Resolution Procedure](https://promisesaplus.com/#point-47)
x 为 promise2 = promise1.then(onFulfilled, onRejected)里onFulfilled/onRejected的返回值
resolve 和 reject 实际上是 promise2 的executor的两个实参，因为很难挂在其他地方，所以一并传过来。
相信各位一定可以对照标准转换成代码，这里就只标出代码在标准中对应的位置，只在必要的地方做一些解释。
*/
function resolutionProcedure(promise2, x, resolve, reject) {
// 规范 2.3.1，x 不能和 promise2 相同，避免循环引用
if (promise2 === x) {
return reject(new TypeError("Chaining cycle detected for promise!"))
}
// 规范 2.3.2
// 如果 x 为 Promise，状态为 pending 需要继续等待否则执行
if (x instanceof MyPromise) {
// 2.3.2.1 如果x为pending状态，promise必须保持pending状态，直到x为fulfilled/rejected
if (x.currentState === PENDING) {
x.then(function(value) {
// 再次调用该函数是为了确认 x resolve 的
// 参数是什么类型，如果是基本类型就再次 resolve
// 把值传给下个 then
resolutionProcedure(promise2, value, resolve, reject)
}, reject)
} else { // 但如果这个promise的状态已经确定了，那么它肯定有一个正常的值，而不是一个thenable，所以这里可以取它的状态
x.then(resolve, reject)
}
return
}
let called = false
// 规范 2.3.3，判断 x 是否为对象或函数
if (x !== null && (typeof x === "object" || typeof x === "function")) {
// 规范 2.3.3.2，如果不能取出 then，就 reject
try {
// 规范2.3.3.1 因为x.then可能是一个getter，这种情况下多次读取就有可能产生副作用
// 既要判断它的类型，又要调用它，这就是两次读取
let then = x.then
// 规范2.3.3.3，如果 then 是函数，调用 x.then
if (typeof then === "function") {
// 规范 2.3.3.3
// reject 或 reject 其中一个执行过的话，忽略其他的
then.call(
x,
y => { // 规范 2.3.3.3.1
if (called) return // 规范 2.3.3.3.3，即这三处谁先执行就以谁的结果为准
called = true
// 规范 2.3.3.3.1
return resolutionProcedure(promise2, y, resolve, reject)
},
r => {
if (called) return // 规范 2.3.3.3.3，即这三处谁先执行就以谁的结果为准
called = true
return reject(r)
}
)
} else {
// 规范 2.3.3.4
resolve(x)
}
} catch (e) { // 规范 2.3.3.2
if (called) return // 规范 2.3.3.3.3，即这三处谁先执行就以谁的结果为准
called = true
return reject(e)
}
} else {
// 规范 2.3.4，x 为基本类型
resolve(x)
}
}
}
// catch 的实现
MyPromise.prototype.catch = function (onRejected) {
return this.then(null, onRejected)
}
// finally 的实现
MyPromise.prototype.finally = function (callback) {
return this.then(function (value) {
return MyPromise.resolve(callback()).then(function () {
return value
})
}, function (err) {
return MyPromise.resolve(callback()).then(function () {
throw err
})
})
}额外，附加 Promise.race 、 Promise.all 、 Promise.allSettled 的实现，有兴趣的可以了解一下
// race
MyPromise.race = function(values) {
return new MyPromise(function(resolve, reject) {
values.forEach(function(value) {
MyPromise.resolve(value).then(resolve, reject)
})
})
}
// all
MyPromise.all = function(arr) {
var args = Array.prototype.slice.call(arr)
return new MyPromise(function (resolve, reject) {
if (args.length === 0) return resolve([])
var remaining = args.length
for (var i = 0; i < args.length; i++) {
res(i, args[i])
}
function res(i, val) {
if (val && (typeof val === 'object' || typeof val === 'function')) {
if (val instanceof MyPromise && val.then === MyPromise.prototype.then) {
if (val.currentState === FULFILLED) return res(i, val.value)
if (val.currentState === REJECTED) reject(val.value)
val.then(function (val) {
res(i, val)
}, reject)
return
} else {
var then = val.then
if (typeof then === 'function') {
var p = new MyPromise(then.bind(val))
p.then(function(val) {
res(i, val)
}, reject)
return
}
}
}
args[i] = val
if (--remaining === 0) {
resolve(args)
}
}
})
}
// allSettled
MyPromise.allSettled = function (promises) {
return new MyPromise((resolve, reject) => {
promises = Array.isArray(promises) ? promises : []
let len = promises.length
const argslen = len
// 如果传入的是一个空数组，那么就直接返回一个resolved的空数组promise对象
if (len === 0) return resolve([])
// 将传入的参数转化为数组，赋给args变量
let args = Array.prototype.slice.call(promises)
// 计算当前是否所有的 promise 执行完成，执行完毕则resolve
const compute = () => {
if(--len === 0) {
resolve(args)
}
}
function resolvePromise(index, value) {
// 判断传入的是否是 promise 类型
if(value instanceof MyPromise) {
const then = value.then
then.call(value, function(val) {
args[index] = { status: 'fulfilled', value: val}
compute()
}, function(e) {
args[index] = { status: 'rejected', reason: e }
compute()
})
} else {
args[index] = { status: 'fulfilled', value: value}
compute()
}
}
for(let i = 0; i < argslen; i++){
resolvePromise(i, args[i])
}
})
}Promise.all、Promise.allSettled 简写由于 Promise.all、Promise.allSettled 判断数组元素太过于繁琐，所以这里可以直接使用 Promise.reslove 包装
MyPromise.all = function(values) {
let promises = [].slice.call(values)
return new MyPromise((resolve, reject) => {
let result = [], count = 0
promises.forEach(promise => {
MyPromise.resolve(promise).then(value=>{
result.push(value)
if(++count === promise.length) {
resolve(result)
}
}).catch(err=>{
reject(err)
})
})
})
}
MyPromise.allSettled = function(values) {
let promises = [].slice.call(values)
return new MyPromise((resolve, reject) => {
let result = [], count = 0
promises.forEach(promise => {
MyPromise.resolve(promise).then(value=>{
result.push({status: FULFILLED, value})
}).catch(err=>{
result.push({status: REJECTED, value: err})
}).finally(()=>{
if(++count === promise.length) {
resolve(result)
}
})
})
})
}[Promise.allSettled 的作用，如何自己实现 Promise.allSettled]
[Promise.any 的作用，如何自己实现一个 Promise.any]
[Promise.prototype.finally 的作用，如何自己实现 Promise.prototype.finally]
终于实现搞定了，继续加油
本文由哈喽比特于3年以前收录，如有侵权请联系我们。
文章来源：https://mp.weixin.qq.com/s/41PPSEUD15Oh1blOtkiCQA
京东创始人刘强东和其妻子章泽天最近成为了互联网舆论关注的焦点。有关他们“移民美国”和在美国购买豪宅的传言在互联网上广泛传播。然而，京东官方通过微博发言人发布的消息澄清了这些传言，称这些言论纯属虚假信息和蓄意捏造。
日前，据博主“@超能数码君老周”爆料，国内三大运营商中国移动、中国电信和中国联通预计将集体采购百万台规模的华为Mate60系列手机。
据报道，荷兰半导体设备公司ASML正看到美国对华遏制政策的负面影响。阿斯麦（ASML）CEO彼得·温宁克在一档电视节目中分享了他对中国大陆问题以及该公司面临的出口管制和保护主义的看法。彼得曾在多个场合表达了他对出口管制以及中荷经济关系的担忧。
今年早些时候，抖音悄然上线了一款名为“青桃”的 App，Slogan 为“看见你的热爱”，根据应用介绍可知，“青桃”是一个属于年轻人的兴趣知识视频平台，由抖音官方出品的中长视频关联版本，整体风格有些类似B站。
日前，威马汽车首席数据官梅松林转发了一份“世界各国地区拥车率排行榜”，同时，他发文表示：中国汽车普及率低于非洲国家尼日利亚，每百户家庭仅17户有车。意大利世界排名第一，每十户中九户有车。
近日，一项新的研究发现，维生素 C 和 E 等抗氧化剂会激活一种机制，刺激癌症肿瘤中新血管的生长，帮助它们生长和扩散。
据媒体援引消息人士报道，苹果公司正在测试使用3D打印技术来生产其智能手表的钢质底盘。消息传出后，3D系统一度大涨超10%，不过截至周三收盘，该股涨幅回落至2%以内。
9月2日，坐拥千万粉丝的网红主播“秀才”账号被封禁，在社交媒体平台上引发热议。平台相关负责人表示，“秀才”账号违反平台相关规定，已封禁。据知情人士透露，秀才近期被举报存在违法行为，这可能是他被封禁的部分原因。据悉，“秀才”年龄39岁，是安徽省亳州市蒙城县人，抖音网红，粉丝数量超1200万。他曾被称为“中老年...
9月3日消息，亚马逊的一些股东，包括持有该公司股票的一家养老基金，日前对亚马逊、其创始人贝索斯和其董事会提起诉讼，指控他们在为 Project Kuiper 卫星星座项目购买发射服务时“违反了信义义务”。
据消息，为推广自家应用，苹果现推出了一个名为“Apps by Apple”的网站，展示了苹果为旗下产品（如 iPhone、iPad、Apple Watch、Mac 和 Apple TV）开发的各种应用程序。
特斯拉本周在美国大幅下调Model S和X售价，引发了该公司一些最坚定支持者的不满。知名特斯拉多头、未来基金（Future Fund）管理合伙人加里·布莱克发帖称，降价是一种“短期麻醉剂”，会让潜在客户等待进一步降价。
据外媒9月2日报道，荷兰半导体设备制造商阿斯麦称，尽管荷兰政府颁布的半导体设备出口管制新规9月正式生效，但该公司已获得在2023年底以前向中国运送受限制芯片制造机器的许可。
近日，根据美国证券交易委员会的文件显示，苹果卫星服务提供商 Globalstar 近期向马斯克旗下的 SpaceX 支付 6400 万美元（约 4.65 亿元人民币）。用于在 2023-2025 年期间，发射卫星，进一步扩展苹果 iPhone 系列的 SOS 卫星服务。
据报道，马斯克旗下社交平台𝕏（推特）日前调整了隐私政策，允许 𝕏 使用用户发布的信息来训练其人工智能（AI）模型。新的隐私政策将于 9 月 29 日生效。新政策规定，𝕏可能会使用所收集到的平台信息和公开可用的信息，来帮助训练 𝕏 的机器学习或人工智能模型。
9月2日，荣耀CEO赵明在采访中谈及华为手机回归时表示，替老同事们高兴，觉得手机行业，由于华为的回归，让竞争充满了更多的可能性和更多的魅力，对行业来说也是件好事。
《自然》30日发表的一篇论文报道了一个名为Swift的人工智能（AI）系统，该系统驾驶无人机的能力可在真实世界中一对一冠军赛里战胜人类对手。
近日，非营利组织纽约真菌学会（NYMS）发出警告，表示亚马逊为代表的电商平台上，充斥着各种AI生成的蘑菇觅食科普书籍，其中存在诸多错误。
社交媒体平台𝕏（原推特）新隐私政策提到：“在您同意的情况下，我们可能出于安全、安保和身份识别目的收集和使用您的生物识别信息。”
2023年德国柏林消费电子展上，各大企业都带来了最新的理念和产品，而高端化、本土化的中国产品正在不断吸引欧洲等国际市场的目光。
罗永浩日前在直播中吐槽苹果即将推出的 iPhone 新品，具体内容为：“以我对我‘子公司’的了解，我认为 iPhone 15 跟 iPhone 14 不会有什么区别的，除了序（列）号变了，这个‘不要脸’的东西，这个‘臭厨子’。
