在javascript中有两个非常有用的函数:setTimeout 和setInterval ,都是定时器;但是两者存在着一些区别;

1. setTimeout函数

用法:setTimeout(fn,time);

解释:在time毫秒之后执行函数fn

示例:

function  setTimeoutTest(){

alert(“函数开始执行”);               //第一步

setTimeout(function(){           //第二步

alert("定时器生效");            //定时程序

},1000);

alert("函数执行完了");               //第三步

}

下面一段话来自网络,可靠性待考证;

代码解释:函数由三步构成,第一步:alert("函数开始执行");  浏览器弹出提示框;第二步setTimeout()函数将其第一个参数(匿名函数)插入js执行队列中,等待1000毫秒后执行。第三步是:alert("函数执行完了");js程序是单线程的,所有要执行的操作都是有序的存在于执行队列中的。当调用setTimeoutTest函数,第一步会立即执行,这个是毫无疑问的,js程序是按照先后顺序执行的,所以来到第二步,但是第二步设置了定时器,所以程序不会立即执行。执行跳到第三部,会立即执行,这也是毫无疑问的。这样,三个弹窗的顺序就为:1-3-2。现在要考虑的问题是:setTimeout函数中的程序在所设置的1000毫秒后是否立即执行?而只是将程序插入到执行队列中,然后跳过具体的执行程序,这样第二步执行的弹窗在第三步之后,现在更总要的问题是:1000秒后第二步所设置的定时器一定会执行吗?第二步程序会在整个setTimeoutTest函数执行完成后执行。假如第三步的执行时间小于1000毫秒,则执行完成后队列中已经没有了待执行的程序,则第二步会在1000毫秒后执行。假如第三步的执行时间大于1000毫秒,则当1000毫秒后第二步程序仍然处在执行ing状态,js解释器不会停下当前的工作去处理定时程序,所以第二步将在第三步程序执行完成后执行(此时已超过了1000毫秒)。

2. setInterval 函数

用法:setInterval(fn,time)

解释:以time为周期调用函数fn;

示例:

function say(){

setInterval(alert("hello world!"),1000);

}

say();

程序会在say函数执行的时间点为起始点,距起始点1000毫秒调用alert("hello world!"),以alert()被执行的点为t1点,距t1点1000毫秒时再次条用alert(),依次类推,递归调用。

js:setTimeout 与 setInterval 比较的更多相关文章

  1. js setTimeout和setInterval区别

    1.区别 2.示例代码 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...

  2. js setTimeout 与 setInterval 以及 for 循环 刷新UI

    1. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式:执行一次: 如果需要执行多次,自身再次调用 setTimeout(): 示例:无穷循环并带停止按钮的 <html&g ...

  3. js setTimeout 和 setInterval 区别

    setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 ...

  4. 关于js中的setTimeout和setInterval

    http://ejohn.org/blog/how-javascript-timers-work 这是John的一篇博文说到setTimeout和setInterval的区别,在看js高效图形编程的时 ...

  5. 原生js轮播以及setTimeout和setInterval的理解

    下面这个代码是从一个群下载下来的,为了帮助自己理解和学习现在贴出来,与初学者共勉. <!DOCTYPE html> <html> <head> <meta c ...

  6. js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象,但是不阻塞script方法

    js里的setTimeout和setInterval是否进程阻塞? 阻塞浏览器的document对象,但是不阻塞script方法 当你在setTimeout中使用document.write时是不行的 ...

  7. js中的setTimeout和setInterval

    在html页面中要使用自动刷新功能时,可以是使用js中setTimeout和setInterval: 一.使用方法 setTimeout的使用setTimeout('要调用的Js方法', 调用的延迟时 ...

  8. js的事件循环机制:同步与异步任务(setTimeout,setInterval)宏任务,微任务(Promise,process.nextTick)

    javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...

  9. 【转】JS中setTimeout和setInterval的最大延时值详解

    前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...

随机推荐

  1. [转]为何需要调用“super viewDidLoad

    转载地址:http://liwpk.blog.163.com/blog/static/36326170201165104413314/   - (void)didReceiveMemoryWarnin ...

  2. Python3基础 sort(reverse=True) 将一个列表降序排列

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

  3. 【leetcode❤python】 160. Intersection of Two Linked Lists

    #-*- coding: UTF-8 -*- #两种方法#方法1:#计算出A和B两个链表的长度分别为m.n;#长度长的链表先走m-n步,之后再一次遍历寻找#方法2:#先走到一个链表的尾部,从尾部开始走 ...

  4. 编译安装php的配置参数详细解析

    ./configure --prefix=/usr/local/php --enable-opcache --enable-fpm --enable-sockets --enable-mysqlnd ...

  5. Consul Template的简单使用

    Consul Template的使用 1安装 地址 https://github.com/hashicorp/consul-template/releases wget https://release ...

  6. 试用VSCode

    VSCode是代码编辑器,不是IDE. 优点: 1.内置ES6代码高亮和提示,语法验证 2.除了支持到变量定义处Go to definition,还支持弹框显示变量定义出peek definition ...

  7. 浅析C#深拷贝与浅拷贝

    1.深拷贝与浅拷贝   拷贝即是通常所说的复制(Copy)或克隆(Clone),对象的拷贝也就是从现有对象复制一个“一模一样”的新对象出来.虽然都是复制对象,但是不同的 复制方法,复制出来的新对象却并 ...

  8. SpringBoot集成jsp(附源码)+遇到的坑

    1.大体步骤 (1)       创建Maven web project: (2)       在pom.xml文件添加依赖: (3)       配置application.properties支持 ...

  9. JAVA的UDP协议交互信息

    由于要做app的UDP协议交互,所以就特地学习了下,其实也就类似于java的server和socket,下面就写了个简单的demo 服务端: package com.test1; import jav ...

  10. 浅谈Eclipse的更新、升级和MyEclipse插件的安装方法

    用的是如下图所示的eclipse标准版演示: 先谈下eclipse下安装MyEclipse插件的过程: 第一种方法:通过MyEclipse的存档进行离线更新 1,到MyEclipse官网进入下载页面, ...