《JavaScript权威指南》第四版中说“window对象方法setTimeout()用来安排一个JavaScript的代码段在将来的某个指定时间运行”。

setTimeout(foo,i); // foo是回调函数,i是延时时间

注意“将来”一词,setTime会把foo函数放到队列中,当线程空闲的时候,JavaScript才会去执行队列里的事件。

看下面的代码:

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript"> window.onload = function () {
var a = 0;
function one() {
for (var i = 0; i < 10; i++) {
console.log(i);
setTimeout(function(){
console.log(a);
a += i; },0);
}; }
function two() {
alert(a);
}
one();
setTimeout(two,0);
}
</script>
</head>
</html>

这里其实one函数看着像是会正常把a从0加到9,然后alert出来。

但实际上的alert结果是100,为什么?

one函数的for循环是不会因为setTimeout停下的,它遇到setTimeout的时候只会把里面的回调函数放到队列里面去,然后继续i++。等执行完所有的for循环才会去执行刚才放到队列的函数。因为循环完了所以i是10,总共有10个相同的a+=i;操作的函数被调用,最后a的结果就变成了100了。

但是其实上面代码有部分我还是不明白,就是如果setTimeout(two,0);改成setTimeout(two(),0);的话,alert的结果就变成了0

setTimeout的第一个参数是函数对象,如果变成two(),那回调函数就变成了two的返回值,因为需要用到two的返回值,two函数就会直接执行,在执行的时候a没有发生任何变化,所以输出就是0了。

附上setTimeout不带参数的一些写法:

setTimeout("alert('3秒后执行我')",3000);                          // 直接把执行语句放在双引号里当参数

setTimeout(function(){alert("3秒后执行我");},3000);               // 直接把一个包含执行语句的匿名函数当参数

setTimeout(two,3000);                                           // 把指针当参数

setTimeout("two()",3000);                                      // 把two()函数放在双引号里当参数,相当于用eval()函数来解析他

setTimeout(function(){two();},3000);                           // 把要执行的函数放在一个匿名函数里当参数

带参数的写法:

setTimeout("two('"+arg1+"',"+"'"+arg2+"',"+....+"')",3000);           // 尽量不要用这一样,很容易弄错

setTimeout(two,3000,arg1,arg2....);                                  // 第一个参数是指针,第二个是延迟执行的时间,后面紧跟着的是调用函数所执行的参数

setTimeout(function(){two(arg1,arg2...);},3000);                     // 直接把要执行的函数已经参数放在匿名函数里当setTimeout的第一个参数

JavaScript学习之setTimeout的更多相关文章

  1. JavaScript学习笔记-setTimeout应用

    setTimeout应用 var ids = [];function foo1(i) { this.i = i; console.log('i = '+i); ids[0] = setTimeout( ...

  2. JavaScript学习之 倒计时

    倒计时很常见,例如离XX活动还有XX天XX小时XX分XX秒,然后逐秒减少,实现很简单,我只是想记录这过程中的一点小坑. 先上代码: <html> <head> <meta ...

  3. Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”

    Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...

  4. JavaScript学习05 定时器

    JavaScript学习05 定时器 定时器1 用以指定在一段特定的时间后执行某段程序. setTimeout(): 格式:[定时器对象名=] setTimeout(“<表达式>”,毫秒) ...

  5. Javascript学习7 - 脚本化浏览器窗口

    原文:Javascript学习7 - 脚本化浏览器窗口 本节讨论了文档对象模型.客户端Javascript下Window中的各项属性,包括计时器.Location对象.Histroy对象.窗口.浏览器 ...

  6. JavaScript学习记录四

    title: JavaScript学习记录四 toc: true date: 2018-09-16 20:31:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  7. JavaScript学习(一) —— 环境搭建与JavaScript初探

    1.开发环境搭建 本系列教程的开发工具,我们采用HBuilder. 可以去网上下载最新的版本,然后解压一下就能直接用了.学习JavaScript,环境搭建是非常简单的,或者说,只要你有一个浏览器,一个 ...

  8. Javascript定时器(二)——setTimeout与setInterval

    一.解释说明 1.概述 setTimeout:在指定的延迟时间之后调用一个函数或者执行一个代码片段 setInterval:周期性地调用一个函数(function)或者执行一段代码. 2.语法 set ...

  9. JavaScript学习(3):函数式编程

    在这篇文章里,我们讨论函数式编程. 什么是函数式编程?根据百度百科的描述,“函数式编程是种编程典范,它将电脑运算视为函数的计算.函数编程语言最重要的基础是 λ 演算(lambda calculus). ...

随机推荐

  1. 基于阿里云安装脚本扩展 之 自动安装mongodb及php扩展

    好久没有发布文章了,有点跟不上当初这个博客的初衷.为了使自己的博客更新不半途而废,今天特意再写了一个自动安装脚本,一样是基于阿里云的服务端安装脚本进行的扩展.闲话不说,直接放代码: #!/bin/ba ...

  2. 设置mysql二进制日志过期时间

    ((none)) > show variables like 'expire_logs_days'; +------------------+-------+ | Variable_name | ...

  3. goland设置go build的工作目录

  4. ACMer之歌

    <<死了都要编>> 死了都要编 不动态规划不痛快 算法多深只有这样 才足够表白 死了都要编 不A星算法不痛快 宇宙毁灭星还在 把每天当成是比赛来编程 一分一秒都编到汗水掉下来 ...

  5. liunx定时删除文件(产生的日志.........)

    linux是一个很能自动产生文件的系统,日志.邮件.备份等.虽然现在硬盘廉价,我们可以有很多硬盘空间供这些文件浪费,让系统定时清理一些不需要的文件很有一种爽快的事情.不用你去每天惦记着是否需要清理日志 ...

  6. jnhs中国的省市县区邮编坐标mysql数据表

    https://blog.csdn.net/sln2432713617/article/details/79412896 -- 1.之前项目中需要全国的省市区数据,在网上找了很多,发现数据要么不全,要 ...

  7. Python科学计算生态圈--Scipy

  8. Uva11384 Help is needed for Dexter

    Dexter is tired of Dee Dee. So he decided to keep Dee Dee busy in a game. The game he planned for he ...

  9. Leetcode46. Permutations全排列

    给定一个没有重复数字的序列,返回其所有可能的全排列. 示例: 输入: [1,2,3] 输出: [ [1,2,3], [1,3,2], [2,1,3], [2,3,1], [3,1,2], [3,2,1 ...

  10. javascript之键盘事件的方法

    键盘事件包含onkeydown.onkeypress和onkeyup这三个事件 事件初始化 function keyDown(){} document.onkeydown = keyDown; //论 ...