塘沽网站建设深圳网站关键词优化公司
主线回顾
第三章：JavaScript引擎 · 行为之火
其他支线
支线一 ·原能之核：语法起源
支线二 ·函数幻阶：语法召唤与逻辑封印
🎬 剧情设定：
踏出函数幻阶，林昊进入一片扭曲的时空——时间在这里并非线性，而是层叠、延迟、甚至并行的。
他坠入一片名为“异步幻境（Async Realms）”的领域，这里流淌着未完成的请求、等待回应的魔咒、与永远 pending 的亡灵代码。
一位身披流沙之袍的旅人现身——时缝守望者·艾希尔。她手持三柄时空钥匙：
- 回调刃（Callback Blade）
- 许诺之镜（Promise Mirror）
- 等待之心（Await Heart）
🪢 第一节 · 回调的诅咒
教学点：基本异步与回调函数
艾希尔首先展示了最古老的异步法术——回调。
function loadData(callback) {setTimeout(() => {console.log("数据加载完成");callback();}, 1000);
}loadData(() => {console.log("后续逻辑执行");
});
setTimeout 是最简单的异步模拟。它并不会阻塞主线程，而是把函数丢进任务队列，等主线程空闲时才执行。
⚠️ 诅咒之始：回调地狱
step1(() => {step2(() => {step3(() => {// 嵌套层层地狱});});
});
✨ 第二节 · Promise：许诺之镜
教学点：Promise 基础与 .then()
艾希尔召唤第二柄钥匙——许诺之镜，让异步的处理变得更加优雅。
const promise = new Promise((resolve, reject) => {let success = true;if (success) {resolve("任务成功！");} else {reject("失败了！");}
});promise.then((res) => {console.log("成功：", res);}).catch((err) => {console.error("错误：", err);});
- resolve() 表示成功
- reject() 表示失败
- .then() 用于处理成功
- .catch() 处理失败
🧘 第三节 · async/await：等待之心
教学点：async/await 基础
艾希尔说：“你无需层层嵌套，也无需许诺链式，只需静心等待。”
function delay(ms) {return new Promise((resolve) => setTimeout(resolve, ms));
}async function main() {console.log("准备...");await delay(1000);console.log("1 秒后执行");
}main();
- async 修饰函数，表明其中可使用 await
- await 暂停当前函数执行，直到 Promise 完成
异步编程的本质：不是“延迟”，而是“暂停与恢复执行”。
🧪 幻境试炼任务
1.使用 setTimeout 实现一个延迟 2 秒后输出 “你好异步” 的函数
2. 写一个返回 Promise 的函数，成功时返回 “数据已到达”，失败时返回错误
3. 编写一个 async 函数，依次调用两个异步任务，并用 try…catch 捕获异常
🌀 本章关键词回顾
| 技术 | 描述 |
|---|---|
| setTimeout | 异步模拟（任务队列） |
| 回调函数 | 异步逻辑最原始方式 |
| Promise | 更优的异步控制结构 |
| async/await | 语法糖，令异步代码同步化书写 |
| try…catch | 异步错误捕获 |
🎁 奖励与成就
林昊掌握三大异步神器，获得称号「时序咏者」，可以安全穿梭时空裂隙，理解非线性逻辑与等待机制。
艾希尔临别低语：“所有异步，只为让你不堵塞主线程之流。待你踏入事件之城，才能真正掌控‘何时’。”