高频js-----js执行机制 Event Loop

修改代码,让代码每隔1秒输出1-5  

for (var i = 0; i < 5;i++) {
    setTimeout(() => {
        console.log(i)
        }, 1000)
  }

首先我们需要了解js的执行机制 (Event Loop)

js是单线层,如果现在执行上面代码的话 会输出 5个5

这里不明白的同学可以去看一下我以前发布的关于EventLoop的文章

这是因为在 JavaScript 中,setTimeout 函数是一个异步函数,它会在指定的时间间隔后执行回调函数。在这段代码中,循环会立即执行,并且在每个迭代中都会调用 setTimeout 函数来创建一个定时器。但是,由于 setTimeout 是异步执行的,循环会继续执行而不会等待定时器的回调函数执行。

下面附上修改后的代码

使用async 和await 进行异步处理

 test 函数中使用了 await 关键字来等待 myPromise 函数返回的 Promise 对象。await 关键字会暂停函数的执行,直到 Promise 对象被解析(resolved)为止 然后每隔1秒打印一个数字

function myPromise(num){
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve(num)
     }, 1000)
      })
   }
  
   async function test() {
    for (var i = 0; i < 5;) {
      i++;
      console.log(await myPromise(i))
    }
   }
  test();

你可能感兴趣的:(javascript,前端,开发语言)