js里的两个内置函数:setInterval()与setTimeout()提供了定时的功能,前者是每隔几秒执行一次,后者是延迟一段时间执行一次。javascript 是一个单线程环境,定时并不是很准,遇到阻塞的操作会延迟,代码:

<script>
var fn = function(){
alert("fn()函数被执行了");
} setInterval(fn,1000);
</script>

  

以上代码会每隔一分钟弹窗,如果不关闭弹窗。Js不会在下一秒执行这个函数。也就说,被阻塞了。

除了setInterval()实现函数重复执行外,还可以用setTimeout()实现函数重复执行。是这么做的:

<script>
var fn = function(){
alert("fn()函数被执行了");
setTimeout(fn, 1000)
} fn();
</script>

  

代码中用setTimeout()调用自身。这样函数执行一次,会一直延迟一段时间调用自身,实现了函数重复执行,是不是觉得很妙?看过许多网页上用到的jquery倒计时插件,都是用setTimeout()来重复执行函数。

setTimeout()执行顺序有个坑,看下面的代码,你觉得控制台输出的结果是什么:

<script>
setTimeout(function() {
console.log(1);
}, 0);
console.log(2);
</script>

  

答案是先输出2,再输出1。这跟我们的直觉是不一致的。当事件队列为空的时候,才执行SetTimeout()里面的代码。

回到前面,js定时不准的问题,看到一篇靠谱的博客,用的是setTimeout()这种。可以参考后续博客,点下面的链接:

前端倒计时不准的问题

js-循环执行一个函数的更多相关文章

  1. ----关于统计字符出现次数的JS循环以及indesxOf函数----

    以下将会通过JS循环判断字符“banana”出现次数 以及调用indexOf中的函数来实现统计   <!DOCTYPE html> <html> <body> &l ...

  2. js 自执行匿名函数(转载)

    自执行匿名函数: 常见格式:(function() { /* code */ })(); 解释:包围函数(function(){})的第一对括号向脚本返回未命名的函数,随后一对空括号立即执行返回的未命 ...

  3. JS如何重写一个函数

    分享一些自己在开发上遇到的问题,比如我们页面上用了大量的打印语句,但是在某些时候,我们不想要了. 解决方案1 : 我们删除这里的代码,如果太多了,那工作量太大好累,想想都不想干 解决方案2 :我们将c ...

  4. JS自执行匿名函数

    常见格式:(function() { /* code */ })(); 解释:包围函数(function(){})的第一对括号向脚本返回未命名的函数,随后一对空括号立即执行返回的未命名函数,括号内为匿 ...

  5. JS 立即执行的函数表达式(function)写法

    1. 正确的写法 对于JavaScript 来说,括弧()里面不能包含语句,所以在这一点上,解析器在解析function关键字的时候,会将相应的代码解析成function表达式,而不是function ...

  6. js循环复制一个div

    <html> <head> <title>Test of cloneNode Method</title> <script type=" ...

  7. pytest--fixure前置执行一个函数

    import pytest@pytest.fixture()def login_r(): print('登陆') @pytest.fixture()def open_browser(): print( ...

  8. 用JS 循环做一个表格

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  9. [转载]js 程序执行与顺序实现详解

    http://www.jb51.net/article/36755.htm JavaScript是一种描述型脚本语言,由浏览器进行动态的解析与执行,浏览器对于不同的方式有不同的解析顺序,详细介绍如下, ...

随机推荐

  1. [poj2396]Buget[上下界可行流]

    题意:有一个n*m的方阵,里面的数字未知,但是我们知道如下约束条件:每一行的数字的和每一列的数字的和某些格子有特殊的大小约束,用大于号,小于号和等于号表示问:是否存在用正数填充这个方阵的方案,满足所有 ...

  2. ORA-12547错误

    http://www.linuxidc.com/Linux/2013-03/81330p3.htm << good http://www.verydemo.com/demo_c158_i6 ...

  3. Chrome development tools学习笔记(3)

    (上次DOM的部分做了些补充,欢迎查看Chrome development tools学习笔记(2)) 利用DevTools Elements工具来调试页面样式 CSS(Cascading Style ...

  4. MSP430WARE++的使用2:RSP1 driver的调用方法

        MSP430WARE是一套基于C++语言的开源的MSP430层次化软件架构,支持多种外设.本文将介绍雷达測速芯片RSP1驱动程序的调用方法.     1.硬件原理图      採用下图所看到的 ...

  5. 蒟蒻的数位DP专题总结

    BZOJ  1026: [SCOI2009]windy数: 题目链接: http://www.lydsy.com/JudgeOnline/problem.php?id=1026           d ...

  6. jQuery - 制作点击显示二级菜单效果

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  7. oc50--@class1

    // // main.m #import <Foundation/Foundation.h> #import "Person.h" int main(int argc, ...

  8. Linux下RTC时间的读写分析【转】

    本文转载自:http://blog.csdn.net/little_walt/article/details/52880840 Linux系统下包含两个时间:系统时间和RTC时间. 系统时间:是由主芯 ...

  9. 无损压缩算法历史——熵编码是最早出现的,后来才有Lzx这些压缩算法

    Lossless   Entropy type Unary Arithmetic Asymmetric Numeral Systems Golomb Huffman  Adaptive Canonic ...

  10. LA4788

    贪心 这个贪心不太懂啊 dfs返回子树需要的最小值,然后按需要减消耗排序,然后贪心选取即可. #include<bits/stdc++.h> using namespace std; ty ...