我们知道有个全局的 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执行顺序——学习笔记的更多相关文章

  1. 浏览器中js执行机制学习笔记

    浏览器中js执行机制学习笔记 RiverSouthMan关注 0.0772019.05.15 20:56:37字数 872阅读 291 同步任务 当一个脚本第一次执行的时候,js引擎会解析这段代码,并 ...

  2. Underscore.js 源码学习笔记(上)

    版本 Underscore.js 1.9.1 一共 1693 行.注释我就删了,太长了… 整体是一个 (function() {...}());  这样的东西,我们应该知道这是一个 IIFE(立即执行 ...

  3. Underscore.js 源码学习笔记(下)

    上接 Underscore.js 源码学习笔记(上) === 756 行开始 函数部分. var executeBound = function(sourceFunc, boundFunc, cont ...

  4. 【09-23】js原型继承学习笔记

    js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...

  5. 纯JS实现KeyboardNav(学习笔记)一

    纯JS实现KeyboardNav(学习笔记)一 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 GitHub项目源码 预览地址 最终效果 KeyboardNav使用指南 ...

  6. 纯JS实现KeyboardNav(学习笔记)二

    纯JS实现KeyboardNav(学习笔记)二 这篇博客只是自己的学习笔记,供日后复习所用,没有经过精心排版,也没有按逻辑编写 这篇主要是添加css,优化js编写逻辑和代码排版 GitHub项目源码 ...

  7. FastJson远程命令执行漏洞学习笔记

    FastJson远程命令执行漏洞学习笔记 Fastjson简介 fastjson用于将Java Bean序列化为JSON字符串,也可以从JSON字符串反序列化到JavaBean.fastjson.ja ...

  8. js的执行环境学习笔记

    js执行全局代码或者执行函数代码的时候,首先进行准备,然后再执行.准备阶段,就是创建执行环境的阶段. 1.执行环境 当一段js代码遇到解释器的时候,比如浏览器打开一段js代码时候,第一件事并不是马上执 ...

  9. js执行顺序

    我们知道有个全局的 window对象,js的一切皆window上的属性和方法.window上有个window.document属性,记录了整个html的dom树,document是顶层. body 和 ...

随机推荐

  1. Codeforces 404D Minesweeper 1D

    题意: 给定字符串,其中'*'表示地雷,'1'表示左/右边有一个地雷相邻,'2'表示左右两边均有地雷相邻,'0'表示左右均无地雷相邻,'?'表示待定,可填入0,1,2或者地雷,有多少种表示方法使字母串 ...

  2. MongoDB C#驱动

    烟波钓徒 MongoDB C#驱动 http://www.mongodb.org/display/DOCS/CSharp+Driver+Tutorial 笔记 首先下载驱动.驱动有两个文件 Mongo ...

  3. mybatis xml标签,批量插入

    <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-/ ...

  4. Nginx/Spring:增加上传文件尺寸限制

    Nginx: 1. vi /etc/nginx/nginx.config 2. 在server中增加如下行 # set client body size to 20M # client_max_bod ...

  5. Python标准库:内置函数tuple([iterable])

    本函数实现从可迭代对象生成一个元组对象返回.元组对象是一个不可改动的列表对象. 样例: #tuple() print(tuple([1, 2, 3])) print(tuple((1, 2, 3))) ...

  6. Linux学习系列之LNMP

    LNMP介绍 LNMP是什么 LNMP(Linux-Nginx-MySQL-PHP)网站架构是目前国际流行的Web架构; 这四种软件组合,可以成为一个免费.高效.扩展性强的Web架构; LNMP原理图 ...

  7. android:“新版飞机大战”源码开源啦!

    今天10.24,为了纪念程序猿的节日,把之前写过的一个"飞机大战"的一个源码开源了. 源码地址:https://github.com/nuptboyzhb/newplanegame ...

  8. frameset怎样实现整个页面的跳转

    登录页面login.jsp,系统登录成功后展示mainLayout.jsp, 我如今用frameset框架把页面mainLayout.jsp分为三部分,head.jsp..left.jsp.right ...

  9. Mac OS 10.10.3下Apache + mod_wsgi配置【一】

    [一] 首先,MAC是自带Apache的,在/private/etc/apache2路径下,能够使用apachectl -v查看版本号.我的版本号例如以下: Server version: Apach ...

  10. centos内核编译配置

    1.下载内核,下面是内核官网地址:https://www.kernel.org/ tar.xz    是完整的内核包(完整的内核包是通过两次压缩得到的.一次是xz,一次是tar) pgp      是 ...