话不多少，直接上代码
一： 提前定义Promise，使用 .then调用（有缺陷，，不建议）
var a1, b2, c3
// Promise
var p1 = new Promise((resolve, reject) => {
setTimeout(() => {
a1 = 12
resolve(‘第yi个promise‘)
}, 5000)
})
var p2 = new Promise((resolve, reject) => {
setTimeout(() => {
b2 = 12
resolve(‘第er个promise‘)
}, 3000)
})
var p3 = new Promise((resolve, reject) => {
setTimeout(() => {
c3 = 12
resolve(‘第san个promise‘)
}, 4000)
})
p1.then( res => {
console.log(res)
console.log(a1 + b2 + c3);
return p2
}).then( res => {
console.log(res)
console.log(a1 + b2 + c3);
return p3
}).then( res =>{
console.log(res);
console.log(a1 + b2 + c3);
})
输出台打印如下
特点：同时打印出来，解决回调地狱是有缺陷的，如果第一个时间长和第一个时间短的效果是不一样的。所以最好不要写这种。
第二种、返回Promise对象，不提前定义（推荐），按照先后顺序执行，第一个没有执行完第二个不会执行。
var a1, b2, c3
// Promise
var p1 = new Promise((resolve, reject) => {
setTimeout(() => {
a1 = 12
resolve(‘第yi个promise‘)
}, 6000)
})
p1.then(res => {
console.log(a1 + b2 + c3)
return new Promise((resolve, reject) => {
setTimeout(() => {
b2 = 13
console.log(a1 + b2 + c3);
resolve(‘第二个promise‘)
}, 1000)
})
}).then(res2 => {
console.log(res2)
return new Promise((resolve, reject) => {
setTimeout(() => {
c3 = 10
console.log(a1 + b2 + c3);
resolve(‘第三个promise‘)
}, 2000)
})
}).then(res3 => {
console.log(res3)
})
浏览器输出如下
第三种方法、将Promise对象封装成函数，进行调用。（墙裂推荐）
function test1() {
return new Promise( (resolve,reject) => {
setTimeout( () => {
console.log(‘test1执行并赋值‘)
resolve(111)
},2000)
})
}
function test2() {
return new Promise( (resolve,reject) => {
setTimeout( () => {
console.log(‘test2 5秒后执行并赋值‘)
resolve(222)
},5000)
})
}
function test3() {
return new Promise( (resolve,reject) => {
setTimeout( () => {
console.log(‘test3 3秒后执行并赋值‘)
resolve(333)
},3000)
})
}
test1().then( res =>{
console.log(res);
return test2()
}).then( res => {
console.log(res);
return test3()
}).then( res =>{
console.log(res);
})
浏览器输出如下：
原文：https://www.cnblogs.com/tdcqcrtd/p/14680072.html