题目:一秒后打印 1,隔两秒打印 2, 再隔三秒打印 3
首先,用普通的 setTimeout 来完成:
setTimeout(() => {
console.log(1)
setTimeout(() => {
console.log(2)
setTimeout(() => {
console.log(3)
}, 3000)
}, 2000)
}, 1000)
这样的嵌套多了会像一个千层蛋糕,不好看且不利于后期维护,所以有了 Promise 对象:
new Promise((resolve) => {
setTimeout(() => {
console.log(1)
resolve();
}, 1000)
}).then(() => {
console.log("1 done");
return new Promise((resolve) => {
setTimeout(() => {
console.log(2);
resolve();
}, 2000)
})
}).then(() => {
console.log("2 done");
return new Promise((resolve) => {
setTimeout(() => {
console.log(3);
resolve();
}, 3000)
})
}).then(() => {
console.log("3 done");
})
那么有没有更舒服的写法呢?
ES7 新增了 async await 语句:
const pp1 = () => {
return new Promise((resolve) => {
setTimeout(() => {
console.log(1);
resolve();
}, 1000)
})
}
const pp2 = () => {
return new Promise((resolve) => {
setTimeout(() => {
console.log(2);
resolve();
}, 2000)
})
}
const pp3 = () => {
return new Promise((resolve) => {
setTimeout(() => {
console.log(3);
resolve();
}, 3000)
})
}
const noSameTime = async () => {
await pp1();
await pp2();
await pp3();
}
noSameTime();