总所周知 js 里面的 setTimeout() 方法是用来设定某些功能在某段时间间隔之后执行的。但是今天看了高程对定时器的描述发现并不是这样。

setTimeout(function(){
//.code
}, 250);

如上设置一个延迟执行的函数,字面上理解是匿名函数体内的代码将会在 250毫秒后执行,但是事实并不是这样。

js 执行代码是单线程的,就是说只能逐个逐个执行(不知道说得对不对),将要执行的代码看成一条时间轴,首先执行的代码是script 标签内的一些对生命周期后面要用到的代码进行部署。当某段时间段空闲的时候,后面的代码才会被迅速被执行。举个例子:

例如现在脚本里有这样一堆代码:

var fn = function(){
//里面的代码执行了300毫秒
}(); setTimeout(function(){
//.code
}, 250); 

fn 这个自执行的函数执行的时候耗时300毫秒,然后才会到下面的 setTimeout 函数执行。

换句话说 setTimeout 函数的执行是当当前执行环境空闲的时候再延迟250毫秒执行自身的代码块,当执行完了 fn 函数之后,环境再开始执行setTimeout 函数。

所以setTimeout 这个函数实际上延迟了 300(fn 执行的时间) + 250(自身延迟时间)= 550毫秒 才被执行,有时候可能还会慢一点

【笔记】js 关于定时器的理解的更多相关文章

  1. [学习笔记]JS中闭包的理解

    一.闭包概念的理解 闭包,又称为词法闭包或函数闭包指引用了自由变量的函数.这个被引用的自由变量将和这个函数一同存在,即使已经离开了创造它的环境也不例外. 自由变量:该变量既不是函数本身定义的也不是函数 ...

  2. 我对 impress.js 源码的理解

    源码看了两天,删掉了一些优化,和对 ipad 的支持,仅研究了其核心功能的实现,作以下记录. HTML 结构如下: <!doctype html> <html lang=" ...

  3. 关于js执行机制的理解

    js是单线程语言.指的是js的所以程序执行通过仅有的这一个主线程来执行. 但是还有辅助线程,包括定时器线程,ajax请求线程和事件线程. js的异步我理解的是: 主线程执行时候,从上到下依次执行,遇到 ...

  4. Node.js Event Loop 的理解 Timers,process.nextTick()

    写这篇文章的目的是将自己对该文章的理解做一个记录,官方文档链接The Node.js Event Loop, Timers, and process.nextTick() 文章内容可能有错误理解的地方 ...

  5. 对js原型简单的理解和图解

    对js原型简单的理解和图解 最近在努力的学习js中,今天就抽了个空把自己理解的原型,记下一下在笔记中,以后自己查看,有空在会把原型链记录一下. 1.prototype prototype:是一个函数的 ...

  6. 前端学习:学习笔记(JS部分)

    前端学习:学习笔记(JS部分) 前端学习:JS学习总结(图解)    JS的简介 JS基本语法 JS内置对象 JS的函数 JS的事件 JS的BOM JS的DOM JS的简介 新建步骤 <body ...

  7. js参数arguments的理解

    原文地址:js参数arguments的理解 对于函数的参数而言,如下例子 function say(name, msg){ alert(name + 'say' + msg); } say('xiao ...

  8. js赋值运算的理解

    简介 js引擎由于为了效率,很多时候的非直接量赋值都不是copy一份在赋值给新的变量,而是一个引用 ps:直接量:直接值数字字符串等 为什么使用len = doms.length; 里的len效率要比 ...

  9. js 模块化的一些理解和es6模块化学习

    模块化 1 IIFE 2 commonjs 3 浏览器中js的模块化 4 简单理解模块加载器的原理  5 es6 之前在参加百度前端技术学院做的小题目的时候,自己写模块的时候 都是写成立即调用表达式( ...

随机推荐

  1. [你必须知道的.NET]第二十八回:说说Name这回事儿

    发布日期:2009.3.18 作者:Anytao © 2009 Anytao.com ,原创作品,转贴请注明作者和出处. 1 缘起 老赵在谈表达式树的缓存(2):由表达式树生成字符串中提到,在描述Ty ...

  2. [水煮 ASP.NET Web API2 方法论](1-3)如何接收 HTML 表单请求

    问题 我们想创建一个能够处理 HTML表单的 ASP.NET Web API 应用程序(使用 application/x-www-form-urlencoded 方式提交数据). 解决方案 我们可以创 ...

  3. python模块安装路径

    Unix(Linux): prefix/lib/pythonX.Y/site-packages 默认路径:/usr/local/lib/pythonX.Y/site-packages 另外,在Unix ...

  4. LCA算法笔记

    LCA,最近公共祖先,实现有多种不同的方法,在树上的问题中有着广泛的应用,比如说树上的最短路之类. LCA的实现方法有很多,比如RMQ.树链剖分等. 今天来讲其中实现较为简单的三种算法: RMQ+时间 ...

  5. 字典树&01字典树算法笔记

    1]学习了字典树之后,觉得它很明显的就是用空间来换时间,空间复杂度特别大,比如字典数单单存26个小写字母,那么每个节点的孩子节点都有26个孩子节点,字典树中的每一层都保留着不同单词的相同字母. 2]0 ...

  6. ZOJ 3327 Friend Number

    构造. (1)如果数字中带有$0$: 1.只有个位是$0$,这种情况就是给输入的数字$+10$再输出即可. 2.其余情况就是给输入的数字$+1$再输出即可. (2)如果数字中没有$0$: 从个位开始一 ...

  7. NOI2015 D1T2 软件包管理器

    题目传送门; 这个貌似是我这个蒟蒻做的第一道NOI系列的题了吧...这题的算法是树链剖分,其实基本上就是很常见的树剖+线段树,题目既然是要求每次安装或卸载改变的软件包的数目,那么就在每次操作前记录下线 ...

  8. webpack HMR原理

    在启动 devServer 的时候,sockjs 在服务端和浏览器端建立了一个 webSocket 长连接,以便将 webpack 编译和打包的各个阶段状态告知浏览器,最关键的步骤还是 webpack ...

  9. Grunt Gulp Browserify Webpack

    Grunt 是相比后面几个更早的项目,他依赖于各种插件的配置.这是一个很好的解决方案,但是请相信我,你不会想看到一个 300 行的 Gruntfile Gulp 提供了一个不一样的解决方案,而不是依赖 ...

  10. [Codeforces 1053C] Putting Boxes Together

    Link: Codeforces 1053C 传送门 Solution: 先推出一个结论: 最后必有一个点不动且其为权值上最中间的一个点 证明用反证证出如果不在中间的点必有一段能用代价少的替代多的 这 ...