setTimeOut与循环闭包问题

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

  结果:0 1 2 3 4 5    结果每间隔1S输出

setTimeOut第二个参数设定xxms后执行,第一的参数是xxms后执行什么动作。

队列的数据结构特点:

这个队列的执行时间,需要等到函数调用栈清空后才开始执行,即所有的可执行代码执行完毕后才开始执行由setTimeOut定义的操作,这些操作进入队列的顺序,由设定的延迟时间来决定。

setTimeout(function () {
    console.log("w");
},0);
console.log("q");

  结果: q   w

匿名函数:

(function () {
    console.log("w")
})()

  会立刻执行,执行后内存会清空这个函数。

setTimeout(function () {
    console.log(a);
},0);

(function () {
    console.log(b+"wwww");
}) ()//1

var a=20;
var b=30;

console.log(a);//2
console.log(fn);//3

(function () {
    console.log(b+"eee");
}) ()//4

function fn() {
    setTimeout(function () {
        console.log("settime 10")
    },10)
}

fn.toString=function () {
    return 30;
}

console.log(fn);//5

setTimeout(function () {
    console.log("settimeout 20ms")
},20);

fn();

(function () {
    console.log(b+"qqq");
}) ()//6

  

结果:

undefinedwwww
20
[Function: fn]
30eee
{ [Function: fn] toString: [Function] }
30qqq
20
settime 10
settimeout 20ms

首先执行console.log()的内容,碰到匿名函数会立即执行,之后setTimeOut才会根据设定的时间进入队列,然后再依次执行。

时间: 2024-10-11 22:29:40

setTimeOut与循环闭包问题的相关文章

循环闭包的影响以及其解决方案

上一次,我已经讲过闭包是如何形成的,以及它的用途.但是对于循环闭包产生的陷阱,和解决方案一笔带过啊(根本就没有)!本着不坑爹的思想,绝逼是要重新再梳理一遍.但无论如何还是要强调一下的,在闭包中会一直引用变量(是引用而不是副本),直到其断开连接不再引用,在内存中的闭包就可以得到释放.所以当我们知道这个道理之后,我们就可以开始我们今天的旅程了. 上次的例子举的不够好,竟然要操作DOM的,这次我们换个更直观的写法,用setTimeout函数. show code! 这一次使用的是定时器setTimeo

JavaScript之全选/反选/取消,for循环闭包

需求:table中要求点击红色单元格和点击checkbox的效果一样,最后一行点击就是全选.反选.取消选择的效果. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> table{ width: 400px; height: 15px; backgrou

循环/闭包/setTimeout/Promise 综合

控制台显示内容为? for (var i = 0; i < 5; i++) { console.log(i); } 控制台显示内容为? for (var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, 1000 * i); } 控制台显示内容为? for (var i = 0; i < 5; i++) { (function(i) { setTimeout(function() { console.log(i

Javascript setTimeout(0),闭包

setTimeout经常被用于延迟执行某个函数,用法为 setTimeout(function(){ - }, timeout); 有时为了进行异步处理,而使用setTimeout(function-,0):比如 function f(){ - // get ready setTimeout(function(){ -. // do something }, 0); return -; } 在setTimeout设定的函数处理器之前,函数f返回: 在使用异步处理时,尤其是使用闭包特性时,要特别小

js的for循环闭包问题

一个简单的例子,如果想循环输出数组中的每一个数值我们可以利用for循环来输出例如: <script type="text/javascript"> var arr=["a","b","c","d","e"]; for (var i=0;i<arr.length;i++){ document.write(arr[i]); } </script> 这是最常见不过

JS之经典for循环闭包问题解决方法

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="bootstrap.css"> </head><body> <div class="

js作用域for循环闭包问题

for(var i = 0;i<btnArr.length;i++){ btnArr[i].addEventListener('click',function(){ tabCardShow(i); }): } 普通的for循环,触发事件时传入的 i 的值一定是等于 btnArr.length ,i 的值停留在了循环执行完毕之后,并不符合初衷. 原因:i只作用于 for循环的作用域,所有 元素绑定时传入的都是该作用域的同一个 i 值,而 i 值停留在了循环最后一次的值上. for(var i =

js for循环闭包解决循环变量i遍历值

参考:http://www.cnblogs.com/syf/archive/2012/10/04/2711828.html 如下的html,为什么每次输出都是5,而不是点击每个p,就alert出对应的1,2,3,4,5. [html] view plaincopyprint? <html > <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

js中for循环闭包问题记录

<script type="text/javascript"> window.onload = function(){ var aImg = document.getElementsByTagName('img'); for(var i=0;i<3;i++){ alert(i); //0,1,2 aImg[i].onclick = function(){ alert(i); //3 } } alert(i);//循环外值依旧为3 } </script> .