setTimeout(call,0)作用
 经常看到setTimeout延时0ms的javascript代码，感到很迷惑，难道延时0ms和不延时不是一个道理吗？后来通过查资料以及实验得出以下两个作用，可能还有作用我还不知道，希望得知的朋友在后面评论上不吝指出。

1、实现javascript的异步；
正常情况下javascript都是按照顺序执行的。但是我们可能让该语句后面的语句执行完再执行本身，这时就可以用到setTimeout延时0ms来实现了。
如： 
alert(1); 
setTimeout("alert(2)", 0); 
alert(3); 
虽然延时了0ms,但是执行顺序为：1，3，2 
这样就保证setTimeout里面的语句在某一代码段中最后执行。

2、在事件中，setTimeout 会在其完成当前任何延宕事件的事件处理器的执行，以及完成文档当前状态更新后，告诉浏览器去启用 setTimeout 内注册的函数。；
 举个例子来说这句话的意思，假如当某个事件在页面上建立一个文本框，并给文本框赋值（完成文档当前状态更新），然后将焦点定到文本框，并且选中文本框的内容（后面部分就需要用到setTimeout 延迟0ms实现，否则不好实现）。
先看个例子：

 1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

2<html>
 3<head>
 4<title>setTimeout</title>
 5<script type="text/javascript" >
 6 (function(){
 7  
 8  function get(id){
 9   return document.getElementById(id);
10  }
11  
12  window.onload = function(){
13   get('makeinput').onmousedown = function(){
14    var input = document.createElement('input');
15    input.setAttribute('type', 'text');
16    input.setAttribute('value', 'test1');
17    get('inpwrapper').appendChild(input);
18    input.focus();
19    input.select();
20   }
21   get('makeinput2').onmousedown = function(){
22    var input = document.createElement('input');
23    input.setAttribute('type', 'text');
24    input.setAttribute('value', 'test1');
25    get('inpwrapper2').appendChild(input);
26    setTimeout(function(){
27     input.focus();
28     input.select();
29    }, 0);
30   }
31   get('input1').onkeypress = function(){
32    get('preview1').innerHTML = this.value;
33   }
34   get('input2').onkeypress = function(){
35                                setTimeout(function(){
36    get('preview2').innerHTML = get('input2').value;
37                               },0 );
38   }
39  }
40 })();
41</script>
42</head>
43<body>
44 <h1><code>DEMO1</code></h1>
45 <h2>1、未使用 <code>setTimeout</code>（未选中文本框内容）</h2>
46 <button id="makeinput">生成 input</button>
47 <p id="inpwrapper"></p>
48 <h2>2、使用 <code>setTimeout</code>（立即选中文本框内容）</h2>
49 <button id="makeinput2">生成 input</button></h2>
50 <p id="inpwrapper2"></p>
51
52--------------------------------------------------------------------------
53 <h1><code>DEMO2</code></h1>
54 <h2>1、未使用 <code>setTimeout</code>(只有输入第二个字符时，前一个字符才显示出来)</h2>
55 <input type="text" id="input1" value=""/><div id="preview1"></div>
56 <h2>2、使用 <code>setTimeout</code>(输入时，字符同时显示出来)</h2>
57<input type="text" id="input2" value=""/><div id="preview2"></div>
58</body>
59</html>
60
61

运行示例
现有的 JavaScript 引擎是单线程处理任务的。它把任务放到队列中，不会同步去执行，必须在完成一个任务后才开始另外一个任务。其实，这是一个把需要执行的任务从队列中跳脱的技巧。在DEMO1中，JavaScript 引擎在执行 onmousedown时，由于没有多线程的同步执行，不可能同时去处理刚创建元素的 focus 和 select 方法，由于这两个方法都不在队列中，在完成 onmousedown 后，JavaScript 引擎已经丢弃了这两个任务，正如第一种情况。而在第二种情况中，由于setTimeout可以把任务从某个队列中跳脱成为新队列，因而能够得到期望的结果。

setTimeout(call,0)作用的更多相关文章

  1. 【 js 基础 】【 源码学习 】 setTimeout(fn, 0) 的作用

    在 zepto 源码中,$.fn 对象 有个 ready 函数,其中有这样一句 setTimeout(fn,0); $.fn = { ready: function(callback){ // don ...

  2. js中 setTimeout延时0毫秒的作用

    经常看到setTimeout延时0ms的javascript代码,感到很迷惑,难道延时0ms和不延时不是一个道理吗?后来通过查资料以及实验得出以下两个作用,可能还有作用我还不知道,希望得知的朋友在后面 ...

  3. setTimeout(fn, 0) 的作用

    在 zepto 源码中,$.fn 对象 有个 ready 函数,其中有这样一句 setTimeout(fn,0); 1 $.fn = { 2 ready: function(callback){ 3 ...

  4. setTimeout(fn,0)的作用分析

    众所周知,大家对setTimeout的用法肯定都比较熟悉了,但是不是还是会经常忘记使用呢,例如博主阿里面试时就忘了,见阿里前端面试. 今天跟大家讨论一下setTimeout(fn,0)的用法,相信很多 ...

  5. Javascript定时器(三)——setTimeout(func, 0)

    setTimeout(func, 0)可以使用在很多地方,拆分循环.模拟事件捕获.页面渲染等 一.setTimeout中的delay参数为0,并不是指马上执行 <script type=&quo ...

  6. setTimeout(f, 0)的应用&利用Deferred实现队列运行

    任务:从mongodb中导出csv数据,输出内容如下userid username usergender points points表: { "userid" : 1022, &q ...

  7. JavaScript下的setTimeout(fn,0)意味着什么？

    近期在研究异步编程的我对于setTimeout之类的东西异常敏感.在SegmentFault上看到了一个问题<关于SetTimeout时间设为0时>:提问者读了一篇文章,原文解释setTi ...

  8. System.exit(0)作用

    System.exit(0)作用   public class HelloGoodbye{ try{ System.out.println(“Hello World”); System.exit(0) ...

  9. setTimeout中0毫秒延时

    先来看段代码,思考一下执行的结果. alert(1); setTimeout(function(){alert(2);}, 0); alert(3); 估计很多人认为执行结果为1,2,3,原因就是认为 ...

随机推荐

  1. Django 系列

    Django基础 Django框架简介 Django 静态文件 Django request对象与ORM简介 Django路由系统 Django之视图层 Django之模板层 Django的setti ...

  2. Caliburn.Micro框架之Action Convertions

    首先新建一个项目,名称叫Caliburn.Micro.ActionConvertions 然后删掉MainWindow.xaml 然后去app.xaml删掉StartupUri这行代码 其次,安装Ca ...

  3. 伪造TGT黄金票据

    通过上一篇文章我们初步了解了Kerberos协议的工作过程,解决的两个问题 第一个问题:如何证明你本人是XXX用户的问题   由Authentication Server负责 第二个问题:提供服务的服 ...

  4. TortoiseGit 绑定 GitHub/Gitee ssh秘钥

    小乌龟生成私钥和公钥 打开PuTTYgen 生成公钥/私钥文件 打开Pageant添加私钥.ppk文件 打开公钥文件获取key 打开GitHub/Gitee添加公钥 Gitee GitHub

  5. MySQL基础（4） | 视图

    MySQL基础(4) | 视图 基本语法 1.创建 CREATE VIEW <视图名> AS <SELECT语句> 语法说明如下. <视图名>:指定视图的名称.该名 ...

  6. Ubuntu-Server18.04开启无线网卡并配置静态ip

    手里有一个笔记本快10年了,还是奔腾处理器,最近把它做成了Ubuntu-Server的系统,花了点时间折腾无线网卡,稍微记录一下,希望看见的人能少踩点坑. 1. 制作U盘启动工具,从Ubuntu官网下 ...

  7. Mac下appium-doctor提示错误汇总

    一.            提示 [Error: Could not detect Mac OS X Version from sw_vers output: '10.12'] 解决方法: 1.终端执 ...

  8. .NetCore学习笔记：四、AutoMapper对象映射

    什么是AutoMapper?AutoMapper是一个简单的小型库,用于解决一个看似复杂的问题 - 摆脱将一个对象映射到另一个对象的代码.这种类型的代码是相当沉闷和无聊的写,所以为什么不发明一个工具来 ...

  9. instanceof读解

    function instance(l,r){ let 0 = r.prototype; let v = l.__proto__; while(true){ if(v === null){ retur ...

  10. java 开发中 dom4j的简单用法

    Java中处理XML的方式有很多种,个人任务dom4j还是比较好用的.下面介绍以下简单的使用方法 先把import补充上 import org.dom4j.Document; import org.d ...