转载自 promise
第一段代码
new Promise((resolve, reject) => {
console.log("log: 外部promise");
resolve();
})
.then(() => {
console.log("log: 外部第一个then");
return new Promise((resolve, reject) => {
console.log("log: 内部第一个promise")
resolve();
})
.then(() => {
console.log("log: 内部第一个then");
})
.then(() => {
console.log("log: 内部第二个then");
})
})
.then(() => {
console.log("log: 外部的第二个then");
})
// 外部promise
// 外部第一个then
// 内部第一个promise
// 内部第一个then
// 外部第二个then
// 内部第二个then
外部第一个new Promise执行,执行 resolve, 执行外部第一个then。 外部第一个then方法里面return 一个promise,这个return, 代表外部第二个then执行需要等待return之后的结果。 当然会先执行完内部的两个then之后,再执行外部的第二个then。
第二段代码
new Promise((resolve, reject) => {
console.log("外部promise");
resolve();
})
.then(() => {
console.log("外部第一个then");
new Promise((resolve, reject) => {
console.log("内部promise");
resolve();
})
.then(() => {
console.log("内部第一个then");
})
.then(() => {
console.log("内部第二个then");
});
})
.then(() => {
console.log("外部第二个then");
});
// 外部promise
// 外部第一个then
// 内部promise
// 内部第一个then
// 外部第二个then
// 内部第二个then
先注册先执行。
链式的 第二个then的注册,需要等待第一个then的同步代码执行完成。
第三段代码
new Promise((resolve, reject) => {
console.log("外部promise");
resolve();
})
.then(() => {
console.log("外部第一个then");
let p = new Promise((resolve, reject) => {
console.log("内部promise");
resolve();
});
p.then(() => {
console.log("内部第一个then");
});
p.then(() => {
console.log("内部第二个then");
})
})
.then(() => {
console.log("外部第二个then");
})
不是链式调用。
两种方式最主要的区别就是:
- 链式调用的注册是前后依赖的, 比如说上面的外部的第二个then的注册,是需要外部第一个then的同步执行完成。
- 变量定义的方式,注册都是同步的, 比如这里的p.then和var p = new Promise()都是同步执行完成的。
第四段代码
let p = new Promise((resolve, reject) => {
console.log(外部promise);
});
p.then(() => {
console.log("外部第一个then");
new Promise((resolve, reject) => {
console.log("内部promise");
resolve();
})
.then(() => {
console.log("内部第一个then");
})
.then(() => {
console.log("内部第二个then");
})
});
p.then(() => {
console.log("外部第二个then");
})
外部的注册采用了非链式调用的写法, 外部的代码的p.then是并列同步注册的,所以代码在内部的new Promise执行完,p.then就都同步注册完了。
内部第一个then注册之后,就开始执行外部的第二个then了。
第五段代码
new Promise((resolve, reject) => {
console.log("外部promise");
resolve();
})
.then(() => {
console.log("外部第一个then");
new Promise((resolve, reject) => {
console.log("内部promise");
resolve();
})
.then(() => {
console.log("内部第一个then");
})
.then(() => {
console.log("内部第二个then");
})
return new Promise((resolve, reject) => {
console.log("内部promise2");
resolve();
})
.then(() => {
console.log("内部第一个then2");
})
.then(() => {
console.log("内部第二个then2");
});
})
.then(() => {
console.log("外部第二个then");
});
Promise/A+和webkit的Promise的实现差异
Promise的then的执行,是依赖于上一个then的执行完成之后,即resolve状态之后,才开始注册到微服务队列中的。
new Promise((resolve, reject) => {
console.log("外部promise");
resolve();
})
.then(() => {
console.log("外部第一个then");
new Promise((resolve, reject) => {
console.log("内部promise");
resolve();
})
.then(() => {
console.log("内部第一个then");
return Promise.resolve();
})
.then(() => {
console.log("内部第二个then");
})
})
.then(() => {
console.log('外部第二个then');
})
.then(() => {
console.log('外部第三个then');
})
Promise/A+的实现:
执行return Promise.resolve(),创建一个Promise实例,将Promise实例设置为resolve状态,这个Promise.resolve()是同步的,切该Promise已经完成了,所以它不回影响其他then的注册。
如下是Promise.resolve的实现:
Promise.resolve = function (value) {
if (value istanceof Promise) return value;
if(value === null) return NULL;
if(value === undefined) return UNDEFINED;
if (value === true) return TRUE;
if (value === false) return FALSE;
if (value === 0) return ZERO;
if (value === '') return EMPTYSTRING;
if (typeof value === 'object' || typeof value === 'function') {
try {
var then = value.then;
if (typeof then === 'function') {
return new Promise(then.bind(value));
}
} catch (ex) {
return new Promise(function(resolve, reject) {
reject(ex);
})
}
}
return valuePromise(value);
}