WWW.lllT.neT
javascript完成交通信号灯的方式:1、应用setTimeout和递归来完成循环系统更改色调;2、应用Promise,并把下一次的色调更改写在then里边;3、应用async await和while完成交通信号灯实际效果。
本实例教程实际操作自然环境:windows7系统软件、javascript1.8.5版本号、Dell G3电脑上。
javascript如何完成交通信号灯?
JavaScript 完成交通信号灯
应用setTimeout、Promise、async await 三种方法完成交通信号灯编码,绿灯2秒,黄灯1秒,信号灯3秒,循环系统更改色调。更改色调的方式,就简易写出打印出出色调。
setTimeout完成
应用setTimeout是最主要的建立方法,编码如下所示,应用递归来完成循环系统更改色调。
function changeColor(color) { console.log('traffic-light ', color); } function main() { changeColor('red'); setTimeout(()=>{ changeColor('yellow'); setTimeout(() => { changeColor('green'); setTimeout(main, 2000); }, 1000); }, 2000); } main();
Promise 完成
应用Promise,把下一次的色调更改写在then里边,最终一样应用递归进行循环系统。
function sleep(duration){ return new Promise(resolve => { setTimeout(resolve, duration); }) } function changeColor(duration,color){ return new Promise(resolve => { console.log('traffic-light ', color); sleep(duration).then(resolve); }) } function main() { return new Promise(resolve => { changeColor(2000, 'red').then(() => { changeColor(1000, 'yellow').then(() => { changeColor(3000, 'green').then(() => { main(); }) }) }) }) }main();
async await 完成
应用async await就可以防止Promise的一连串.then.then.then,也不会再必须递归,应用while就可以完成循环系统。
function sleep(duration) { return new Promise(resolve => { setTimeout(resolve, duration); }) } async function changeColor(color, duration) { console.log('traffic-light ', color); await sleep(duration); } async function main() { while (true) { await changeColor('red', 2000); await changeColor('yellow', 1000); await changeColor('green', 3000); } } main();
建议学习培训:《javascript基础教程》
以上便是javascript如何完成交通信号灯的详尽具体内容,大量请关心自学java网其他相关文章!
WWW.lllT.neT声明:有的资源来自网络转载,版权归原作者所有,如有侵犯到您的权益请联系邮箱:our333@126.com我们将配合处理!
原文地址:javascript如何完成交通信号灯发布于2021-12-15 10:09:01