前言

JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()setInterval()这两个函数来完成。而这篇文中主要给大家介绍的是关于JS中setTimeout和setInterval最大延时值的相关问题,需要的朋友们下面来一起学习学习吧。

先来看这样一段代码:

function update() {
loadData().then(function(data) {
$('#content').html(data.content);
var delay = data.nextUpdateTime - new Date();
if (delay > 0) {
setTimeout(update, delay);
}
});
}

其流程非常简单:通过AJAX加载数据后更新HTML的内容;如果有指定下次更新时间,则通过计时器在该时间点再执行一次整个流程。

要说这段代码有什么隐患的话,那就是data.nextUpdateTime与当前时间的时间差(即delay变量的值)比较小的时候,会导致内容频繁更新。但这是属于正常的业务逻辑,要优化就只能牺牲内容更新的即时性。然而这里我要说的是,当时间差非常大的时候,也会出现同样的问题。

下面模拟一下这个场景:

function log() {
console.log('executed');
} var nextUpdateTime = new Date();
// 设为一个月后
nextUpdateTime.setMonth(nextUpdateTime.getMonth() + 1); var delay = nextUpdateTime - new Date();
setTimeout(log, delay);

这段代码的原意是让log函数在一个月后执行,但是运行一下就可以发现,该函数会马上执行。为什么会这样呢?

搜一下相关内容可以发现,setTimeout是使用Int32来存储延时参数值的,也就是说最大的延时值是2^31-1。一旦超过了最大值,其效果就跟延时值为0的情况一样,也就是马上执行。

这个最大的延时值已经接近一个月了,一般情况下,用户也不会长时间开着一个网页,如果真开了这么久,那就刷新一下吧:

function update() {
loadData().then(function(data) {
$('#content').html(data.content);
var delay = data.nextUpdateTime - new Date();
if (delay > 0) {
// 限制最大延时值为一天
var ONE_DAY = 24 * 60 * 60 * 1000;
if (delay > ONE_DAY) {
setTimeout(function() {
window.location.reload();
}, ONE_DAY);
} else {
setTimeout(update, delay);
}
}
});
}

同样的问题也存在于setInterval中。这也算是Javascript中一个比较隐蔽的坑了。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

from:http://www.codesky.net/article/201704/183492.html

【转】JS中setTimeout和setInterval的最大延时值详解的更多相关文章

  1. Node.js中的不安全跳转如何防御详解

    Node.js中的不安全跳转如何防御详解 导语: 早年在浏览器大战期间,有远见的Chrome认为要运行现代Web应用,浏览器必须有一个性能非常强劲的Java引擎,于是Google自己开发了一个高性能的 ...

  2. Node.js中setTimeout和setInterval的使用

    Node.js和js一样也有计时器,超时计时器.间隔计时器.及时计时器,它们以及process.nextTick(callback)函数来实现事件调度.今天先学下setTimeout和setInter ...

  3. js中setTimeout和setInterval的应用方法(转)

    JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...

  4. JS中SetTimeOut和SetInterval方法的区别?

    1.setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭.由 ...

  5. js中setTimeout、setInterval、 clearInterval方法简介

    setTimeout setTimeout(code, millisec) 用于在指定的毫秒数后调用函数或计算表达式. 说明: setTimeout()只执行一次code.如果要多次调用,要使用set ...

  6. Js中JSON.stringify()与JSON.parse()与eval()详解及使用案例

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.因为采用独立于语言的文本格式,也使用了类似于C语言家族的习惯,拥有了这些特性使使JSON称为理想的数据交换语 ...

  7. js中的事件委托(事件代理)详解

    本文转载:https://www.cnblogs.com/liugang-vip/p/5616484.html#!comments js中的事件冒泡.事件委托是js 中一些需要注意的小知识点,这里结合 ...

  8. JS中的call、apply、bind方法详解

    bind 是返回对应函数,便于稍后调用:apply .call 则是立即调用 . apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(co ...

  9. 【转】Js中的window.parent ,window.top,window.self 详解

    [转自]http://blog.csdn.net/zdwzzu2006/article/details/6047632 在应用有frameset或者iframe的页面时,parent是父窗口,top是 ...

随机推荐

  1. 使用Retrofit2+RxJava2+ProtoBuf实现网络请求

    引言 Retrofit 是一个用于 Android 和 Java 平台的类型安全的,底层使用OkHttp实现网络请求框架.Retrofit 通过将 API 抽象成 Java 接口而让我们连接到 RES ...

  2. 设计模式—模板方法的C++实现

    这是Bwar在2009年写的设计模式C++实现,代码均可编译可运行,一直存在自己的电脑里,曾经在团队技术分享中分享过,现搬到线上来. 1. 模板方法简述 1.1 目的 定义一个操作中的算法骨架,而将一 ...

  3. JS使用cookie实现只出现一次的广告代码效果

    我们上网经常会遇到第一次需要登录而之后不用再登录的网站的情况,其实是运用了Cookie 存储 web 页面的用户信息,Cookie 以名/值对形式存储,当浏览器从服务器上请求 web 页面时, 属于该 ...

  4. 被低估的.net(中) - 广州.net俱乐部2019年纲领

    这是被低估的.net系列的中篇.上篇在这里:被低估的.net(上) - 微软MonkeyFest 2018广州分享会活动回顾 中篇本来不是这样的,中篇的草稿大纲其实在写上篇之前就写好了,嗯,当时给张队 ...

  5. View体系第二篇:View滑动

    View滑动的基本思想:当点击事件传到View时,系统记下触摸点的坐标,手指移动时系统记下触摸后的坐标并计算出偏移量,然后根据偏移量修正View坐标. 实现View滑动共有6种方法:layout()方 ...

  6. 5步告诉你QQ音乐的完美音质是怎么来的,播放器的秘密都在这里

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由QQ音乐技术团队发表于云+社区专栏 一.问题背景与分析 不久前,团队发现其Android平台App在播放MV视频<凤凰花开的路口 ...

  7. Python爬取网络图片

    代码: import urllib import urllib.request import re #打开网页,下载器 def open_html ( url): require=urllib.req ...

  8. [20180822]session_cached_cursors与子游标堆0.txt

    [20180822]session_cached_cursors与子游标堆0.txt --//前几天测试刷新共享池与父子游标的问题,--//链接: http://blog.itpub.net/2672 ...

  9. linux c 开发通用结构,框架

    转自:http://www.maomao365.com/?p=673 了解其它语言的框架例:java Struts1.Struts2.Hibernate.Mybatis.Ibatis.Spring 等 ...

  10. Sql2012如何将远程服务器数据库及表、表结构、表数据导入本地数据库

    1.第一步,在本地数据库中建一个与服务器同名的数据库 2.第二步,右键源数据库,任务>导出数据,弹出导入导出提示框,点下一步继续 3.远程数据库操作,确认服务器名称(服务器地址).身份验证(输入 ...