js异步成同步
这里写目录标题题目解答Callback(回调函数)PromiseGeneratorasyncjs异步成同步有4种方法:Callback/Promise/Generator/async,下面我以题目为例子演示这四种方法。题目现有打印红色、绿色和黄色三个函数,要求等待三秒后打印一次红色,然后等待2秒后打印一次绿色,接着等待一秒后再打印一次黄色;按此规律不断循环打印红绿黄。// 亮灯函数如下:funct
·
- js异步成同步有4种方法:
Callback/Promise/Generator/async
,下面我以题目为例子演示这四种方法。
题目
- 现有打印红色、绿色和黄色三个函数,要求等待三秒后打印一次红色,然后等待2秒后打印一次绿色,接着等待一秒后再打印一次黄色;按此规律不断循环打印红绿黄。
// 亮灯函数如下:
function red(){ console.log(‘red’); }
function green(){ console.log(‘green’); }
function yellow(){ console.log(‘yellow’); }
解答
Callback(回调函数)
function Callback(){
setTimeout(() => {
red();
setTimeout(() => {
green()
setTimeout(() =>{
yellow()
Callback();
}, 1000)
}, 2000);
}, 3000);
}
Callback()
Promise
// Promise
function light(fun, time){
return new Promise((res) => {
setTimeout(() => {
fun()
res()
}, time);
})
}
function promise(){
Promise.resolve().then(() => {
return light(red, 3000) // 要返回Promise对象
}).then(() => {
return light(green, 2000)
}).then(() => {
return light(yellow, 1000)
}).then(() =>{
promise()
})
}
promise()
Generator
// Generator
function light(fun, time, gt){
setTimeout(() => {
fun()
gt.next()
}, time);
}
let gt = "" // 让gt去控制函数的运行
function *generator(){
yield light(red, 3000, gt)
yield light(green, 2000, gt)
yield light(yellow, 1000, gt)
gt = generator()
gt.next()
}
gt = generator()
gt.next()
async
function light(fun, time){
return new Promise((res) => {
setTimeout(() => {
fun()
res()
}, time);
})
}
async function asyncFun(){
await light(red, 3000) // async/await是一个组合
await light(green, 2000)
await light(yellow, 1000)
asyncFun()
}
asyncFun()
更多推荐
已为社区贡献1条内容
所有评论(0)