分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

JS 定时器&异步任务与函数节流

发布时间:2023-09-06 02:15责任编辑:蔡小小关键词:定时器

定时器

JavaScript 提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()setInterval()这两个函数来完成。它们向任务队列添加定时任务。

1)setTimeout

 setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的编号,以后可以用来取消这个定时器。

var timer = setTimeout(func|code, delay); ?//第一个参数可以是函数也可以是代码块,第二个是延迟的时间,单位是毫秒console.log(1);setTimeout(‘console.log(2)‘,1000);console.log(3);// 1// 3// 2

如果第一个参数填入的是代码,需要加上引号必须是字符串的形式,里面有eval的方法将字符串解析成代码执行,一般最好不要用这种方式。

2)setInterval

setInterval函数的用法与setTimeout完全一致,区别仅仅在于setInterval指定某个任务每隔一段时间就执行一次,也就是无限次的定时执行。

var i = 0;var timer = setInterval(function(){ ???console.log(i++)},1000)01234//每隔一秒执行一次代码。

这两个定时器的方法执行后会有个返回值,是它们的编号,我们可以对这些编号进行操作。

setInterval(function(){ ???console.log(‘zxw‘);},1000)30 ?//可以对编号进行操作,如用clearInterval可以清除代码继续执行var timer =clearInterval(function(){ ???console.log(‘zxw‘);},1000)clearInterval(timer)

3)单线程模型

指的是任务在一个线程上执行,JavaScript同时只能执行一个任务,其他任务都必须在后面排队等待。
注意,JavaScript 只在一个线程上运行,不代表 JavaScript 引擎只有一个线程。事实上,JavaScript 引擎有多个线程,单个脚本只能在一个线程上运行(称为主线程),其他线程都是在后台配合。

4)运行机制

setTimeoutsetInterval的运行机制,是将指定的代码移出本轮事件循环,等到下一轮事件循环,再检查是否到了指定时间。如果到了,就执行对应的代码;如果不到,就继续等待。

这意味着,setTimeoutsetInterval指定的回调函数,必须等到本轮事件循环的所有同步任务都执行完,才会开始执行。由于前面的任务到底需要多少时间执行完,是不确定的,所以没有办法保证,setTimeoutsetInterval指定的任务,一定会按照预定时间执行。

5)异步

程序里面所有的任务,可以分成两类:同步任务(synchronous)和异步任务(asynchronous)。

同步任务是那些没有被引擎挂起、在主线程上排队执行的任务。只有前一个任务执行完毕,才能执行后一个任务。

异步任务是那些被引擎放在一边,不进入主线程、而进入任务队列的任务。只有引擎认为某个异步任务可以执行了(比如 Ajax 操作从服务器得到了结果),该任务(采用回调函数的形式)才会进入主线程执行。排在异步任务后面的代码,不用等待异步任务结束会马上运行,也就是说,异步任务不具有“堵塞”效应。

6)函数节流

当一个方法频繁多次用到,以判断最后一个的操作为准。
var timerfunction hiFrequency(){ ???if(timer){ ???????clearTimeout(timer) ???} ?????timer = setTimeout(function(){ ??????????console.log(‘do something‘) ?????}, 300)}

JS 定时器&异步任务与函数节流

原文地址:https://www.cnblogs.com/ianyanyzx/p/9682668.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved