这次,彻底搞懂Promise和async/await。
Promise已经比传统的回调函数(Callback Hell)更先进,那后来为社么又出现async/await了呢?
async/await的出现是为了让异步代码写起来更像同步代码,解决Promise在复杂场景下的嵌套问题和可读性问题,让我们能更轻松地编写和维护异步逻辑。
Notes:
* async/await 底层仍然是 Promise,只是写法更简洁。
* await 只能在 async 函数中使用,否则会报错。
* async 函数总是返回 Promise。
* await 会阻塞当前 async 函数的执行,但不会阻塞整个程序。
举例: 比如入门Web3项目开发,必须要先学会Next.js、ethers.js、Solidity、Go, 才能做智能合约开发。基础代码如下:
function learnNextJs() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("1. 已完成 Next.js 学习");
resolve();
}, 1000);
});
}
function learnEthersJs() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("2. 已完成 ethers.js 学习");
resolve();
}, 1500);
});
}
function learnSolidity() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("3. 已完成 Solidity 学习");
resolve();
}, 2000);
});
}
function learnGo() {
return new Promise((resolve) => {
setTimeout(() => {
console.log("4. 已完成 Go 学习(可选)");
resolve();
}, 500);
});
}
然后使用 Promise 链式调用(必须按顺序学习)
learnNextJs()
.then(() => learnEthersJs())
.then(() => learnSolidity())
.then(() => learnGo())
.then(() => {
console.log("恭喜!你现在可以开发完整的 Web3 项目了!");
})
.catch((error) => {
console.log("学习过程中出错:", error);
});
输出结果是:
1. 已完成 Next.js 学习
2. 已完成 ethers.js 学习
3. 已完成 Solidity 学习
4. 已完成 Go 学习(可选)
恭喜!你现在可以开发完整的 Web3 项目了!
那如果换成async/await方式呢?
async function web3LearningPath() {
try {
// 必须按顺序学习
await learnNextJs(); // 等待第一步完成
await learnEthersJs(); // 然后学习第二步
await learnSolidity(); // 接着学习第三步
// Go 是可选的,可以并行学习
const optionalLearning = learnGo(); // 不等待,继续执行后面代码
console.log("正在同时学习 Solidity 和 Go...");
await optionalLearning; // 如果需要确保Go也学完才继续
console.log("恭喜!你现在可以开发完整的 Web3 项目了!");
// 现在可以开始智能合约开发了
await startSmartContractDevelopment();
} catch (error) {
console.log("学习过程中出错:", error);
}
}
// 启动学习流程
web3LearningPath();
async function startSmartContractDevelopment() {
console.log("开始智能合约开发...");
}
则输出结果为:
1. 已完成 Next.js 学习
2. 已完成 ethers.js 学习
3. 已完成 Solidity 学习
正在同时学习 Solidity 和 Go…
4. 已完成 Go 学习(可选)
恭喜!你现在可以开发完整的 Web3 项目了!
开始智能合约开发…
最后:
Promise是基础,所有异步操作最终都是Promise,async/await是更优雅的写法,让异步代码更易读。在 Web3 开发中,大部分情况应使用async/await。