几个例子弄懂JS 的setTimeout的运行方式

<span style="font-size:18px;">例子:1</span>
function test() {
	  var a = 1;
	  setTimeout(function() {
	    alert(a);
	    a = 5;
	  }, 1000);
	}
	test();
	alert(0);//前面的两个setTimeout延迟了 所以先执行这个

结果:先弹出0,然后弹出1.

例子2

function test() {
	  var a = 1;
	  setTimeout(function() {
	    alert(a);
	    a = 5;
	  }, 1000);
	  alert(a);

	}
	test();
	alert(0);

结果:先弹出1,然后弹出0,最后弹出1 。

先执行test()里的alert(),因为function此时还未执行,因此,a任然为1.因为function还在被延迟着,因此,执行了alert(0),最后到时间了,执行了alert(a),因为前面a已经变为1了,所以,最后弹出的是1.

例子:3:

function test() {
	  var a = 1;
	  setTimeout(function() {
	    alert(a);
	    a = 5;
	  }, 1000);
	  a = 19;
	}
	test();
	alert(0);//前面的alert因为setTimeout延迟了 所以先执行这个。

结果:会先弹出0,然后弹出19.

延迟了function() {

alert(a);

a = 5;

}

但是a=19还是会照常执行,不是等到延迟结束。所以,执行这个被延迟函数的时候,a=19了!

例子4

function test() {
	  var a = 1;
	  setTimeout(function() {
	    alert(a);
	    a = 5;
	  }, 1000);
	  a = 19;
	setTimeout(function() {
	   alert(a);
	    a = 4;
	  }, 3000);
	}
	test();
	alert(0);//前面的两个setTimeout延迟了 所以先执行这个

结果:会先弹出0,然后弹出19,最后弹出5.

附加解释下全局变量和局部变量!

全局变量:在函数之外定义,或在函数内赋值但前面没加 var 关键字的,都是全局变量

局部变量:定义在函数之内,且前面有 var 关键字的变量

时间: 2024-12-15 06:53:01

几个例子弄懂JS 的setTimeout的运行方式的相关文章

摘录和再编:彻底弄懂JS执行机制

网文: https://juejin.im/post/59e85eebf265da430d571f89 并发模型和事件循环:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/EventLoop Node.js事件循环,Timers, process.nextTick() javascript是一门单线程语言,在最新的HTML5中提出了Web-Worker,但javascript是单线程这一核心仍未改变.所以一切javascript版的

如何继承Date对象?由一道题彻底弄懂JS继承。

前言 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会及时修正. ----------长文+多图预警,需要花费一定时间---------- 故事是从一次实际需求中开始的... 某天,某人向我寻求了一次帮助,要协助写一个日期工具类,要求: 此类继承自Date,拥有Date的所有属性和对象 此类可以自由拓展方法 形象点描述,就是要求可以这样: // 假设最终的类是 MyDate,有一个getTest拓展方法 let date = new MyDate(); // 调用Date的方法,输出GM

通过一个简单闭包,弄懂JS执行原理

<script> function f1()            {                var age = 18; function f2()                {                    alert('我今年:'+age+'岁');                } return f2;            }                var func3 = f1(); func3();</script>            闭包

一个例子读懂 JS 异步编程: Callback / Promise / Generator / Async

JS异步编程实践理解 回顾JS异步编程方法的发展,主要有以下几种方式: Callback Promise Generator Async 需求 显示购物车商品列表的页面,用户可以勾选想要删除商品(单选或多选),点击确认删除按钮后,将已勾选的商品清除购物车,页面显示剩余商品. 为了便于本文内容阐述,假设后端没有提供一个批量删除商品的接口,所以对用户选择的商品列表,需要逐个调用删除接口. 用一个定时器代表一次接口请求.那思路就是遍历存放用户已选择商品的id数组,逐个发起删除请求del,待全部删除完成

彻底弄懂js循环中的闭包问题

第一次接触这个问题还是在我刚开始学js的时候,当时就是一头雾水,时隔一年多了,突然又想起了这个问题,在这个春气盎然的周末,我就坐下来研究下并把结果和大家分享下: 先看代码:demo.html<!DOCTYPE HTML> <html>  <head>   <meta charset="gbk"/>   <title>闭包循环问题</title>   <style type="text/css&quo

一个简单例子弄懂什么是javascript函数劫持

javascript函数劫持很简单,一般情况下,只要在目标函数触发之前,重写这个函数即可. 比如,劫持eval函数的代码如下: var _eval=eval; eval=function(x){ if(typeof x=='undefined') {return;} alert(x); //这里可以写任意多代码 _eval(x); } eval('alert(1)');//这时eval先弹出参数值,然后才是动态执行参数值 哈哈,是不是很简单.

彻底弄懂JS的事件冒泡和事件捕获

先上结论:在事件执行流中有两种执行方式.一种是事件冒泡(即事件的执行顺序是从下往上执行的) ;  另一种是捕获(即事件的执行顺序是从上往下执行的); 阻止事件冒泡:   return false;  火狐/ie都支持 function(even){ var ev=even||window.even; if(ev&&ev.stopPropagation){ ev.stopPropagation(); }else{ window.event.cancelBubble=true; } } 这是H

js模块化编程之彻底弄懂CommonJS和AMD/CMD!

先回答我:为什么模块很重要? 答:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块.但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套! 于是下面三个模块规范出来了,这篇文章也出来了(拼出来的 {捂脸笑}). JS中的模块规范(CommonJS,AMD,CMD),如果你听过js模块化这个东西,那么你就应该听过或CommonJS或AMD甚至是CMD这些规范咯,我也听过,但之前也真的是听听而已. 现在就看看吧,这些规范

[转]js模块化编程之彻底弄懂CommonJS和AMD/CMD!

原文: https://www.cnblogs.com/chenguangliang/p/5856701.html ------------------------------------------------------------------------------------------------------ 先回答我:为什么模块很重要? 答:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块.但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你