settimeout第三个参数

更新日期: 2022-09-16阅读: 502标签: 参数

说起来你可能不相信,setTimeout居然有第三个参数,我以前也没用过这个,是前几天看别人博客发现的,咋一看还以为写错了吧,下面一起看看这个setTimeout第三个参数。


setTimeout

setTimeout()方法设置一个定时器,该定时器在定时器到期后执行一个函数或指定的一段代码语法如下:

var timeoutID = scope.setTimeout(function[, delay, arg1, arg2, ...]);
var timeoutID = scope.setTimeout(function[, delay]);
var timeoutID = scope.setTimeout(code[, delay]);

setTimeout函数有三个参数

fn:(必传)需要执行的函数。
time:(非必传) 延迟的毫秒数  。
  • 传值时:倒计时time毫秒后执行fn;
  • 不传时:默认为0,fn在最早可得的空闲时间执行,在"任务队列"的尾部执行fn,因此要等到同步任务和"任务队列"现有的事件都处理完,才会得到执行。
param:(非必传) 附加参数,一旦定时器到期,它们会作为参数传递给。

我们可以知道定时器启动的时候,第三个及以后的参数会作为第一个 func()的参数传进去。


应用一

一起来看个经典的栗子吧:

for (var i = 0; i < 5; i++) {
  setTimeout(function () {
    console.log(i);
  }, 1000);
}

上面这个栗子,大家都知道会连续输出 5 个 5,因为 setTimeout 是一个异步操作,而等到执行 setTimeout 时,for 循环已经执行完毕,这时的 i 已经等于 5,所以输出 5 次 5。当然,这并不是我们想要的。

方案一

最常见的改进方案是使用闭包。通过闭包,可以将变量 i 驻留在内存中,当输出 j 时,引用的是外部函数传递的变量 i,这个 i 是根据循环来的,执行 setTimeout 时已经确定了里面 i 的值,进而确定了 j 的值。

for (var i = 0; i < 5; i++) {
  (function (j) {
    setTimeout(function () {
      console.log(j);
    }, j * 1000);
  })(i);
}

方案二

运用 setTimeout 的第三个参数。由于每次传入的参数是从 for 循环里面取到的值,所以会依次输出 0~4。

for (var i = 0; i < 5; i++) {
  setTimeout(
    function (j) {
      console.log(j);
    },
    i * 1000,
    i
  );
}

应用二

这个用例的使用场景不常见,但可以对 setTimeout 有进一步的了解。

var doc = document.getElementById("div");
setTimeout(
  function () {
    doc.style.color = "red";
  },
  10000,
  setTimeout(function () {
    doc.style.color = "black";
  }, 5000)
);

上面的结果是,div 元素内的字体样式 5 秒后变黑,10 秒后再变红。


链接: https://www.fly63.com/article/detial/12135

用js获取url地址协议,参数,端口号,锚点等方法总汇

在前端开发中,经常会遇到获取URL的相关数据,下面将总结下使用JavaScript来获取url地址的协议,参数,端口号,锚点等方法。

JavaScript深入之参数按值传递

ECMAscript中所有函数的参数都是按值传递,也就是,把函数外部的值复制给函数内部的参数,就和把值从一个变量复制到另一个变量一样。js始终是按值传递,在这里称他为共享传递。

URLSearchParams_js中快速构造和获取URL查询参数的方法

URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。URLSearchParams()是个构造函数,将返回一个可以操作查询字符串的对象。

js通过arguments来获取指定参数

通过访问arguments对象的length属性可以获取有多少个参数传递给了函数。在封装函数的时候,会携带不同的参数,我们想要获取指定的参数,可以通过 arguments[ ] 来拿到,arguments对象可以与命名参数一起使用。arguments的值要永远与对应命名参数的值保持同步

如何给外部引用的js文件传递参数

给外部引用的js文件传递参数的4种方式:定义全局变量、在src后面传参、检索js文件(js文件要最后引入)、设置其他属性

jquery ajax error函数和及其参数详细说明

一般error函数返回的参数有三个: function(jqXHR jqXHR, String textStatus, String errorThrown)。常见调用代码如下:这里对这三个参数做详细说明。

vue-router动态路由设置参数可选

在日常工作中,我们需要将匹配到的所有路由,映射到一个组件上。如下代码想要达到的效果:不传page和id,则映射到user默认list页面,传page和id,根据page不同,显示不同的页面

掌握JS函数中的几种参数形式

函数是一段结合在一起执行特定任务的代码,函数一般使用参数与外部进行交互。要编写简洁高效的JS代码,必须掌握函数参数。在本文中,会使用一些有趣的例子来解释 JS 必须有效地处理函数参数的所有特性。

你需要了解的前后端传参

前后端传参一般有两种形式:key=value 形式传参(即 parameter 形式);body 形式传参(传 json 数据给后端),如果使用的是 GET 请求,浏览器展示的 Request URL 会自动在路径后面加上 ?a=1&b=2这样的参数,这就是 key=value 形式传参

Less参数混合

* 参数可以使用逗号或分号分隔。 (建议使用分号,因为逗号具有双重含义:可以将其解释为mixin参数分隔符或者是css列表分隔符);使用逗号作为mixin分隔符使不可能创建逗号分隔的列表作为参数。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!