zoukankan      html  css  js  c++  java
  • 深入理解JavaScript定时函数setTimeout

    以一段javascipt代码为例分析说明

     1 function test() {
     2   var a = 0;
     3   a = 1;
     4   setTimeout(function() {
     5     alert(a);
     6     a = 1;
     7   }, 1000);
     8 
     9   a = 2;
    10 
    11   setTimeout(function() {
    12     alert(a);
    13     a = 3;
    14   }, 3000);
    15 }
    16 
    17 test();
    18 
    19 alert(0);

    当脚本开始执行的时候,首先调用test(),代码会继续往下执行,所以alert(0)会先执行,窗口弹出0

    再分析test()代码
    声明变量a,并赋初值0,接着将a的值改为1
    此时执行定时函数setTimeout
    这里要说明一下,浏览器中有各种各样的事件,如点击事件、定时器事件等,各种事件都是以队列的方式
    进入javaScript引擎的,最后按照顺序依次执行。这也从另一方面说明了JavaScript的执行方式是单线程的。
    所以1000毫秒之后由定时器setTimeout产生的异步事件会进入到JavaScript引擎的队列中,但是需要注意的是
    在这1000毫秒的时间内,javaScript引擎也一直在解析代码,所以接下来a被赋值为2,所以第二个弹窗中弹出
    a的值为2,
    由于队列是顺序执行的,所以第一个setTimeout事件后,a被赋值为1,所以第二个setTimeout中alert弹窗中
    a的值为1,虽然a最后被赋值为3,但是第二个setTimeout是javascript中最后的一个事件,运行到这里脚本结束。

    参考文章:

    http://www.laruence.com/2009/09/23/1089.html

    http://www.cnblogs.com/jeffwongishandsome/archive/2011/06/13/2080145.html

  • 相关阅读:
    [转]GPS原始数据说明
    [转]标准USB,MiniUSB接口定义
    warning C4819: 该文件包含不能在当前代码页(936)中表示的字符
    with用法
    turn out用法
    keep用法
    Stop doing和Stop to do和Stop...from doing有什么不同
    figure用法
    wanna用法
    seem用法
  • 原文地址:https://www.cnblogs.com/iaknehc/p/7368182.html
Copyright © 2011-2022 走看看