js执行顺序——学习笔记
我们知道有个全局的 window对象,js的一切皆window上的属性和方法。window上有个window.document属性,记录了整个html的dom树,document是顶层。

body 和 head 都是 doc上的一个属性。


上图中,head里面的打印结果是null,因为document是按照和我们阅读文字一样的方式按顺序加载的,并且,当加载到一个script标签时,会执行其中的代码,而此时body部分还没有加载,所以为null。

所以,如果js代码在doc加载之前要选择或操作dom时就要写在 onload的事件回调中,如果不是操作dom,比如做个运算,获取请求接口数据,就不用关心onload没有。js放最后也是个办法,但一般我们应用都比较复杂,既有逻辑运算,也有操作dom,我们可能希望在更早的时候就执行逻辑运算的部分。所以还是想放到head去。
js 是单线程同步执行的,一旦遇到报错就会退出,中断执行。

故上面的代码会报错,停在第10行。
那如果用函数把第10行包起来呢?

当然,done还是不会打印,即便是一个函数,在调用这个函数时,会按顺序执行函数中的代码,遇到错误一样退出。这些都叫同步执行,所谓同步,就是指,按从上至下的顺序执行,一旦遇到错误就会退出程序,后面的代码将不会运行。
当执行到 test()时,会执行函数里的代码,遇到错误就退出了,所以done不会执行打印出来。

js 在运行时,会先全局扫描 var 和 function 声明的对象。

上面的代码结果会是什么呢?(in 前面是字符串,后面是对象结构。用来判断一个对象上是否有前面的键值(属性))
结果是undefined。解释一下,因为js 先全局扫面了 var,事先var了一个a,这样window上就有一个a为undefined了,
if (!("a" in window))
那么这个条件判断的时候,window上就是有一个a的,而且为undefined,既然有a了,那也就不会执行if里的语句了。所以a不会被赋值。上面的代码拆开来看,真正的执行顺序如下:

var 会事先扫描,将声明的部分 var a; 提取到最前面执行,a = 1; 而赋值的部分依然在原来的位置执行。
下面换一个方式。

效果如下:

最后,感谢大神CX的讲解。
js执行顺序——学习笔记的更多相关文章
- 浏览器中js执行机制学习笔记
浏览器中js执行机制学习笔记 RiverSouthMan关注 0.0772019.05.15 20:56:37字数 872阅读 291 同步任务 当一个脚本第一次执行的时候,js引擎会解析这段代码,并 ...
- Underscore.js 源码学习笔记(上)
版本 Underscore.js 1.9.1 一共 1693 行.注释我就删了,太长了… 整体是一个 (function() {...}()); 这样的东西,我们应该知道这是一个 IIFE(立即执行 ...
- Underscore.js 源码学习笔记(下)
上接 Underscore.js 源码学习笔记(上) === 756 行开始 函数部分. var executeBound = function(sourceFunc, boundFunc, cont ...
- 【09-23】js原型继承学习笔记
js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...
- 纯JS实现KeyboardNav(学习笔记)一
纯JS实现KeyboardNav(学习笔记)一 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 GitHub项目源码 预览地址 最终效果 KeyboardNav使用指南 ...
- 纯JS实现KeyboardNav(学习笔记)二
纯JS实现KeyboardNav(学习笔记)二 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 这篇主要是添加css,优化js编写逻辑和代码排版 GitHub项目源码 ...
- FastJson远程命令执行漏洞学习笔记
FastJson远程命令执行漏洞学习笔记 Fastjson简介 fastjson用于将Java Bean序列化为JSON字符串,也可以从JSON字符串反序列化到JavaBean.fastjson.ja ...
- js的执行环境学习笔记
js执行全局代码或者执行函数代码的时候,首先进行准备,然后再执行.准备阶段,就是创建执行环境的阶段. 1.执行环境 当一段js代码遇到解释器的时候,比如浏览器打开一段js代码时候,第一件事并不是马上执 ...
- js执行顺序
我们知道有个全局的 window对象,js的一切皆window上的属性和方法.window上有个window.document属性,记录了整个html的dom树,document是顶层. body 和 ...
随机推荐
- POJ 3279 Fliptile【枚举】
题意: 又是农夫和牛的故事...有m*n个黑白块,黑块的背面是白块,白块背面是黑块,一头牛踩一块,则这个块的上下左右的方块都会转动,问至少踩多少块,才会使所有块都变成白色? 分析: 还是开关问题,同样 ...
- [bzoj4281][ONTAK2015]Związek Harcerstwa Bajtockiego_倍增LCA
Związek Harcerstwa Bajtockiego bzoj-4281 ONTAK-2015 题目大意:给定一棵有n个点的无根树,相邻的点之间的距离为1,一开始你位于m点.之后你将依次收到k ...
- MongoDB环境搭建教程收集(待实践)
先收集,后续再实践. https://my.oschina.net/leezhen/blog/207262 http://www.360doc.com/content/11/0708/09/26606 ...
- JAVA 小程序之ATM
一个JAVA的小程序,主要要求有模块化编程的思想,能够把ATM中各个功能独立成为一个一个的方法. ATM主要功能有: 查询余额: 取款: 存款: 修改密码: 退出. 以上功能均由独立的方法给出,具体实 ...
- sqlite自己主动更新数据库
写一个类继承自 SQLiteOpenHelper 系统会自己主动加入构造方法. onCreate方法.onUpgrade方法 当数据库里面数据或者表结构有所修改时.咱们须要升级数据库 这个时候.版本 ...
- Django打造大型企业官网(一)
一.nvm的安装 (1)下载:nvm1.16 (2)安装完成后添加环境变量 C:\Users\Administrator\AppData\Roaming\nvm (3)修改settings.txt,将 ...
- C语言之基本算法21—可逆素数
/* ================================================================== 题目:可逆素数是指一个数是素数,逆序后还是素数,如ABC是素 ...
- tomcat的HTTPS
完美配置Tomcat的HTTPS 博客分类: Tomcat HTTPS Tomcat配置HTTPS的文章到处都有,过程也比较简单,随后文中会转一段过来. 但对于启用APR情况下报异常“java.l ...
- Android Jni层 创建 linux socket 出错问题解决
问题: 想在Jni层创建 udp socket 与服务端通信,可是没有成功.最后发现居然是创建socket失败(代码例如以下) // create socket g_sd = socket(AF_IN ...
- 获取SQLServer连接字符串的方法
第一步:创建向导文件 在桌面创建一个txt文件,并将文件后缀改成“.udl”. 第二步:选择“提供程序”tab页 双击新创建的“.udl”文件,进入后选择“提供程序”tab页,选择“Micro ...