怎么说呢，

前言

每天见到的红绿灯。循环节奏是：红灯 3 秒、绿灯 2 秒、黄灯 1 秒。本质上就是 JavaScript 中经典的异步流程控制问题面试中常被称作🚥红绿灯算法。今天我们用极简方式，为这个“马路指挥家”写一段代码，让它按顺序稳稳亮起。

使用者痛点

如果你正在准备技术面试，经常会被问到“如何实现红绿灯算法”，或者在实际项目里遇到异步流程无法按预期执行。这些都让你头疼不已：

• 不知道 Promise、async/await 的区别与适用场景。
• 尝试手写递归或链式调用时总出现“并发跑”或“死循环”的错误。
• 缺少一个通用、可复用的示例来快速验证思路。

下面的示例将逐步拆解这些难点，让你从根本上掌握异步控制。说起来，

一、先给红绿灯定个 “打工规则”

需求很简单这方面。红→绿→黄 的顺序循环亮灯，每个颜色对应固定时间。主要难点在于——必须等前一个灯亮完，下一个才开始，不能出现“红绿同框”。

在 JS 中，要实现这种“等一等再干活”的逻辑。Promise 是最佳拍档。先封装一个设置灯色和时长的函数，让每个灯亮起都变成一个"可等待" 的任务：

// 定义设置灯色的函数。返回 Promise 对象
function setColor {
return new Promise => {
console.log;setTimeout => {
resolve;
// 任务完成，返回当前灯色
},time);})，}

二、多方案实现：让红绿灯按节奏循环亮灯

writestyle : async/await —直白的 “指令式” 写法

async/await 是最贴近自然语言的写法，把异步流程写成同步逻辑：

// async/await 实现循环亮灯
async function run {
while {
await setColor;// 等红灯亮完3秒
await setColor;// 等绿灯亮完2秒
await setColor;// 等黄灯亮完1秒
}
}
run;

writestyle : 递归 + n 链 — “接力式” 写法

This is a native Promise style using .n,achieving an infinite loop via recursion:

// Recursion + n chain to cycle lights
function run {
setColor.n =>
setColor.n =>
setColor.n => run)
)
);}
run，

writestyle : Promise 链 + 定时器 — “手动计时循环” 写法

If you want to avoid recursion,wrap full sequence in a single promise chain and use .setInterval. This guarantees that each cycle starts exactly after previous one finishes.

// Define complete light sequence as a promise chain
function lightSequence {
return setColor
.n => setColor)
.n => setColor);}
// Execute sequence every total duration
setInterval;// Immediately run once so we don't wait at page load.
lightSequence;

writestyle : Generator 函数 + 自动执行 — “迭代式” 写法

The ES6 generator offers a clean way to model iterative asynchronous flows. By yielding promises and consuming m with an async iterator,we achieve an elegant loop.

// Generator function defining light sequence
function* lightGenerator {
while {
yield setColor;yield setColor;yield setColor;}
}
// Automatically execute generator using async iterator pattern
async function runGenerator {
const gen = lightGenerator;for await { /* color is resolved value */ }
}
runGenerator;

看似普通的 red‑green‑yellow 指示。却隐藏了 JavaScript 异步编程最主要的逻辑：Promise 用来解决“等待”，而 async/await 或递归则帮助我们管理“顺序与循环”。掌握这些模式后你就能在任何需要按顺序执行异步任务的场景下游刃有余——无论是面试还是日常项目开发。