(1)、 promise的then()返回一个新的promise,可以看成then()的链式调用
(2)、通过then的链式调用串联多个同步/异步任务
注意:.then()里面指定回调函数的执行发生的条件:
- 必须事先指定好对应的回调函数
- 对应状态发生改变
new Promise((resolve,reject) => {
setTimeout(() => {
console.log('-----------执行第一个异步任务------------');
resolve('异步:111111111111' );
},2000)
})
//第二个promise(执行第二个同步任务)
.then(
value => {
console.log('第二个promise对象:获取第一个promise异步任务传来的数据:' + value);
console.log('------------执行第二个同步任务-------------');
return '22222222';
}
)
//第三个promise(执行第三个异步任务)
.then(
//---------注意:这里虽然进行了异步操作,但是没有封装在promise对象里面,setTimeout里面的操作并不会立马执行,而是在2秒后挂在任务队列等待执行(并没有实现真正的【串联操作】)----------
value => {
console.log('第三个promise对象:获取第二个promise同步任务传来的数据:' + value);
setTimeout(() => {
console.log('----------执行第三个异步任务---------------');
return '333333';
},2000)
//默认返回 undefined
}
)
//第四个promise(执行同步任务)
.then(
value => {
console.log('第四个promise对象:获取第三个promise异步任务传来的数据:' + value);
console.log('-----------执行第四个同步任务-------------');
return '44444444';
}
)
运行截图:
正确版本
//第一个promise(执行第一个异步任务)
new Promise((resolve,reject) => {
setTimeout(() => {
console.log('-----------执行第一个异步任务------------');
resolve('异步:111111111111' );
},2000)
})
//第二个promise(执行第二个同步任务)
.then(
value => {
console.log('第二个promise对象:获取第一个promise异步任务传来的数据:' + value);
console.log('------------执行第二个同步任务-------------');
return '22222222';
}
)
//第三个promise(执行第三个异步任务)
.then(
value => {
console.log('第三个promise对象:获取第二个promise同步任务传来的数据:' + value);
//注意这里返回的是一个新的promise对象,里面的异步操作得到的数据可以被传递下去
return new Promise((resolve,reject) => {
//进行异步操作
setTimeout(() => {
console.log('----------执行第三个异步任务---------------');
resolve('33333');
},2000)
})
}
)
//第四个promise(执行同步任务)
.then(
value => {
console.log('第四个promise对象:获取第三个promise异步任务传来的数据:' + value);
console.log('-----------执行第四个同步任务-------------');
return '44444444';
}
)
运行结果: