美文网首页
JS异步机制原理及注意事项

JS异步机制原理及注意事项

作者: 苦苦修行 | 来源:发表于2018-07-17 16:26 被阅读0次

推荐两篇优秀文章:

首先阅读 Javascript 异步实现机制

然后阅读 js-关于异步原理的理解和总结

这篇文章setTimeout与setInterval的坑以及优缺点也可以看看,但作者写的很乱,读起来有些困难。另外文中的例子也有问题,请看我文中例1的修正版。

要点总结:

  • js代码中出现异步代码时(比如settimeout、ajax等),会交由宿主(浏览器或者nodejs的Libuv,它们是多线程的)执行,执行完后将任务加入到js的事件队列中。
  • 当js的同步代码(也就是主线程)执行完后(也就是主线程空闲时),检查事件队列(这个过程叫事件循环,英文叫tick),若有要执行的任务,将其推入到js主线程中执行。

注意事项:

当使用setInterval()时,仅当没有该定时器的任何其他代码实例时,才将定时器代码添加到队列中,某些间隔会被跳过(抛弃)。

说人话就是,假如

setInterval(function(){
    doSomething();
},1000);

我们会认为,它总是每隔1秒执行一次,但是:
如果已经有一个doSomething加入到事件队列中了,还没等到它执行,1秒的时间就又到了,按理说会再次将一个doSomething加入到事件队列,但是,事实上不会,会将这次忽略。

基于这个问题,所以请使用例1代替例2,请看下列代码:

//例一:
setTimeout(function(){
  var args = arguments;
  console.log("小马");
  setTimeout(function(){args.callee();},1000);
},1000);

//例二:
setInterval(function(){console.log("小马");},1000);

知识点拓展,请阅读 arguments.callee

相关文章

  • JS异步机制原理及注意事项

    推荐两篇优秀文章: 首先阅读 Javascript 异步实现机制 然后阅读 js-关于异步原理的理解和总结 这篇文...

  • 初步讲解JS中的callback回调原理

    初步讲解JS中的callback回调原理 JS的异步执行机制 什么是异步执行 为了提高Javascript代码的运...

  • 解析Vue.nextTick

    一、原理 1、vue异步异步更新队列(JS运行机制 、 事件循环)Vue 在观察到数据变化时并不是直接更新 DOM...

  • 大规模NodeJS项目架构与优化

    聊聊大规模NodeJS项目架构 NodeJS异步IO原理浅析及优化方案 NodeJS内存管理机制及内存优化 大规模...

  • # JS运行机制及Event Loop

    了解js执行顺序及机制,更好的理解js特性,理顺代码中的一些异步操作 ? JavaScript是单线程的语言 Ev...

  • JS异步机制

    刚开始使用JS异步的时候,有这样的疑问:JS不是单线程的吗?为什么会有异步机制?但是如果没有异步机制,定时器又是怎...

  • JS notebook goods

    JS 机制 JavaScript异步机制 Excuse me?这个前端面试在搞事! JavaScript 运行机制...

  • 模拟异步函数

    异步函数实现机制(async.js) 实现了支持同步函数和异步函数的声明 声明异步函数 调用异步函数

  • NodeJS基础原理

    NodeJS基础原理 异步IO原理浅析及优化方案 异步IO的好处(输入输出input output) 前端通过异步...

  • 大规模Node项目架构和优化

    这节课我们要讨论什么 1、NodeJs异步IO原理浅析及优化方案 2、nodejs内存管理机制以及内存优化 3、大...

网友评论

      本文标题:JS异步机制原理及注意事项

      本文链接:https://www.haomeiwen.com/subject/hkcgpftx.html