当前位置:网站首页>es6的async函数

es6的async函数

2022-08-09 11:09:00 一头小驴

如下例子,可以初步帮我们理解javascript的线程机制。我们都知道javascript是单线程,那么它是怎么实现异步的呢?
然后async在google上已经支持,据说用babel转为es5可能更兼容。

//一个让当前线程休眠一段时间的方法
function sleep(interval) {
  return new Promise(resolve => {
    setTimeout(resolve, interval);
  })
}
//异步函数
async function one2FiveInAsync(name) {
  for(let i = 1; i <= 5; i++) {
    console.log(i+name);
    //每一次循环打印之后,让当前的处理休眠一段时间(可以理解为进入异步处理)并继续后续同步代码的执行
    // 等到下一轮如果休眠完成,再继续
    await sleep(1000);
  }
}
one2FiveInAsync("第一次");
one2FiveInAsync("第二次");
for(let i = 0;i<=10;i++){
    console.log("同步"+i)
}
//从执行结果我们可以看出,javascript对于线程是一轮一轮的去访问遍历的,
//而不是某个异步完成后回调函数立即执行的,而是等到下一波轮询的时候执行
// 1第一次
// 1第二次
// 同步1
// 同步2
// 同步3
// 同步4
// 同步5
// 同步6
// 同步7
// 同步8
// 同步9
// 同步10
// 2第一次
// 2第二次
// 3第一次
// 3第二次
// 4第一次
// 4第二次
// 5第一次
// 5第二次
class Sleep {
  constructor(timeout) {
    this.timeout = timeout;
  }
  then(resolve, reject) {
    const startTime = Date.now();
    setTimeout(
      () => resolve(Date.now() - startTime),
      this.timeout
    );
  }
}
function sleep(interval) {
  return new Promise(resolve => {
    setTimeout(resolve, interval);
  })
}
(async () => {
  const sleepTime = await new Sleep(5000); //注意这里加await和不加await的区别 注意整个异步函数内部,使用await之后,它会等待计算出来结果之后,再获得执行权,继续往下跑。
  console.log("线程休眠时间"+sleepTime);
  console.log("同步代码执行标记2");
})();
console.log("异步函数体外----同步代码执行标记2");
//从执行

//异步函数体外----同步代码执行标记2
// 线程休眠时间5002
// 同步代码执行标记2
原网站

版权声明
本文为[一头小驴]所创,转载请带上原文链接,感谢
https://blog.csdn.net/qq_37326058/article/details/105185355