用js实现红绿灯效果:红 4s -> 黄 2s -> 绿 4s -> 黄 2s 循环播放
// 初始化红绿灯集合const lights = [{name: '红',time: 4000,},{name: '黄',time: 2000,},{name: '绿',time: 4000,},]// 初始化指针const point = {position: 0,direction: 0, // 控制指针移动方向属性:0:向右,1:向左}recycle()/*** 指针移动控制器* 通过判断指针位置控制指针移动方向*/function recycle() {activeLights(lights[point.position])if (point.position < lights.length - 1 && point.direction === 0) {// 如果指针未到达最后一个元素并且指针移动方向向右,则执行右向下一个任务point.position += 1} else if (point.position > 0 && point.direction === 1) {// 如果指针未到达第一个元素并且指针移动方向向左,则执行左向下一个任务point.position -= 1} else if (point.position === lights.length - 1) {// 如果指针位置在最后一个元素,则改变方向向左point.direction = 1point.position -= 1} else if (point.position === 0) {// 如果指针位置在第一个元素,则改变方向向右point.direction = 0point.position += 1}}/*** 激活指定灯的闪烁*/function activeLights(light) {class TwinkleLight {constructor() {this.light = lightthis.count = 0}twinkle() {const that = thisconst promise = new Promise(((resolve) => {setTimeout(function () {console.log(`${that.light.name} - ${that.count + 1}`)that.count += 1if (that.count === that.light.time / 1000) {resolve(that.count)} else {that.twinkle()}}, 1000)}))// 成功回调后才执行下一次闪烁promise.then(() => {recycle()return true}).catch((err) => {console.warn(`Error: ${err}`)})}}const twinkle = new TwinkleLight(light)twinkle.twinkle()}