实现一个打点计时器,要求
1、从 start 到 end(包含 start 和 end),每隔 100 毫秒 console.log 一个数字,每次数字增幅为 1
2、返回的对象中需要包含一个 cancel 方法,用于停止定时操作
3、第一个数需要立即输出

* 使用setTimeout方法

var timer;

function count(start, end) {
if (start <= end) {
console.log(start);
start++;
timer = setTimeout(function() {
count(start, end);
}, 100);
} return {
cancel: function() {
clearTimeout(timer);
}
}
}

 

* 使用setInterval方法

function count(start, end) {
console.log(start++);
var timer = setInterval(function() {
start <= end ? console.log(start++) : clearInterval(timer);
}, 100);
return {
cancel: function() {
clearInterval(timer);
}
}
}

  

javascript 定时器 timer setTimeout setInterval (js for循环如何等待几秒再循环)的更多相关文章

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

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

  2. Javascript定时器(三)——setTimeout(func, 0)

    setTimeout(func, 0)可以使用在很多地方,拆分循环.模拟事件捕获.页面渲染等 一.setTimeout中的delay参数为0,并不是指马上执行 <script type=&quo ...

  3. JavaScript定时器:setTimeout()和setInterval()

    1 超时调用setTimeout() 顾名思义,超时调用的意思就是在一段实际之后调用(在执行代码之前要等待多少毫秒) setTimeout()他可以接收两个参数: 1 要执行的代码或函数 2 毫秒(在 ...

  4. js 定时器(setTimeout/setInterval)出现变量未定义(xxx is not defined) 的解决方法

    首先声明本人资质尚浅,如有错误,欢迎指正.共同提高. ------------------------------------------------------------------------- ...

  5. 定时器相关 setTimeout setInterval 函数节流

    这个问题也是在参加百度的前端技术学院中遇到的 任务中需要用js实现动画  导师给的评价中setInterval会导致bug 当时不理解   下面把自己学习的过程分享出来 再次理解单线程   老是说js ...

  6. JavaScript定时器(Timer)

    版权声明:本文为博主原创文章,未经博主允许不得转载.https://www.cnblogs.com/gaoguowen/p/11119088.html 什么是定时器 简单来说就是在一段时间间隔后执行一 ...

  7. js中setTimeout/setInterval定时器用法示例

    js中setTimeout(定时执行一次)和setInterval(间隔循环执行)用法介绍. setTimeout:在指定的毫秒数后调用指定的代码段或函数:setTimeout示例代码 functio ...

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

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

  9. javascript定时器:setTimeout与setInterval

    概述: setTimeout:在指定的延迟时间之后调用一个函数或者执行一个代码片段,只执行一次: setInterval:周期性地调用一个函数(function)或者执行一段代码,重复执行: 语法格式 ...

随机推荐

  1. 007 PCI总线的桥与配置(二)

    一.PCI桥与PCI设备的配置空间 PCI设备都有独立的配置空间,HOST主桥通过配置读写总线事务访问这段空间.PCI总线规定了三种类型的PCI配置空间,分别是PCI Agent设备使用的配置空间,P ...

  2. IDEA spring boot项目插件打包方式jar

    一.打包 1.pom.xml中添加插件依赖 <build> <plugins> <plugin> <!--打包成可执行jar--> <groupI ...

  3. STM32—TIMx输出PWM信号驱动MG996R舵机

    文章目录 一.前言 二.MG996R舵机简介 三.TIM定时器简介 四.通用定时器TIMx 1.TIMx主要功能 2.TIMx框图 3.计数单元 4.时钟选择 5.输出比较PWM 五.TIM3输出双路 ...

  4. Blazor+Dapr+K8s微服务之开发环境调试

    1         安装Dapr开发调试环境 1.1         Dapr 完整安装模式不支持开发调试 在上一篇随笔<Blazor+Dapr+K8s微服务之服务调用>中,我们通过为每个 ...

  5. 【网络编程】TCPIP-8-套接字的多种选项

    目录 前言 8. 套接字的多种选项 8.1 API getsockopt(); & setsockopt(); 8.2 套接字选项 8.3 缓冲区相关可选项 8.4 端口复用 8.4.1 ti ...

  6. NOIP 模拟 $38\; \rm a$

    题解 \(by\;zj\varphi\) 压行. 枚举两行,将中间的行压成一行,然后直接前缀和加二分. 注意边界细节问题. Code #include<bits/stdc++.h> #de ...

  7. 在C#中使用C++编写的类——用托管C++进行封装

    现在在Windows下的应用程序开发,VS.Net占据了绝大多数的份额.因此很多以前搞VC++开发的人都转向用更强大的VS.Net.在这种情况下,有很多开发人员就面临了如何在C#中使用C++开发好的类 ...

  8. nginx 实现反向代理、负载均衡、高可用

    转自:https://blog.csdn.net/zy1471162851/article/details/91795712 tip:   nginx是一款高性能的http 服务器/反向代理服务器及电 ...

  9. Web应用安全防护-WAF

    web应用开发中不可避免需要考虑web应用的安全问题,那么常见的安全风险包含哪些呢? Web应用常见的安全风险 在web应用开发中可能存在以下的安全风险: 安全风险Top 10 A1:2017-注入 ...

  10. Linkerd 2.10(Step by Step)—控制平面调试端点

    Linkerd 2.10 系列 快速上手 Linkerd v2 Service Mesh(服务网格) 腾讯云 K8S 集群实战 Service Mesh-Linkerd2 & Traefik2 ...