我们知道有个全局的 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 是按照 代码块 进行 编译.执行 的. 学习至: 1.变量声明提升 2.新唐的博客 3.js中匿名函数的创建与调用方法分析 4.前端圣经 - <高程三> 5.深入理解变量 ...

  2. RequireJS 加载 js 执行顺序

    初次接触RequireJS 对文档理解不很透彻,自己通过测试测到的执行顺序: 文档结构: |-amaze | -js | -amazeui.js | -jquery.min.js | -main.js ...

  3. js执行顺序——学习笔记

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

  4. js执行顺序<转>

    JavaScript执行引擎并非一行一行地分析和执行程序,而是一段一段地分析执行的.而且在分析执行同一段代码中,定义式的函数语句会被提取出来优先执行.函数定义执行完后,才会按顺序执行其他代码. 先看看 ...

  5. JS执行顺序问题

    JavaScript执行引擎并非一行一行地分析和执行程序,而是一段一段地分析执行的.而且在分析执行同一段代码中,定义式的函数语句会被提取出来优先执行.函数定义执行完后,才会按顺序执行其他代码. 先看看 ...

  6. js执行顺序总结

    参考博文:http://www.2cto.com/kf/201401/273825.html http://www.jb51.net/article/44123.htm http://zhidao.b ...

  7. js 执行顺序

    同步任务 异步任务 同步任务:立即执行 异步任务:进入到异步队列当中(Event Queue)eg:Ajax,SetTimeout,then,SetInterval Event loop 事件循环 T ...

  8. 小程序js执行顺序

    底部tab 有 login/index    my/index   home/index 操作1>进 login/index 页面,  index.js加载以下方法 onLoad页面加载onSh ...

  9. 关于js执行顺序

    http://www.cnblogs.com/sanshi/archive/2011/02/28/1967367.html http://mtnt2008.iteye.com/blog/701981 ...

随机推荐

  1. 新浪微博客户端(20)-集成MJRefresh

    HomeViewController.m /** 集成下拉刷新控件 */ - (void)setupPullToRefreshView { __unsafe_unretained UITableVie ...

  2. thinkphp-1

    thinkphp网站: http://thinkphp.cn, http://bbs.thinkphp.cn 在设置文件夹查看试图的时候, 只点" 应用到所有文件夹" 不要点&qu ...

  3. [Effective JavaScript 笔记]第4章:对象和原型--个人总结

    前言 对象是js中的基本数据结构.对象在js语言编码中也随处可见,比如经常会用到的函数,也是一个Function构造函数,Function.prototype原型对象.每当声明一个函数时,都会继承Fu ...

  4. 第19章 使用PXE+Kickstart部署无人值守安装

    章节概述: 本章节将教会您通过PXE+DHCP+TFTP+VSftpd+Kickstart服务程序搭建出无人值守安装系统,从而批量部署客户机系统. 这种系统能够实现自动化运维.避免了重复性劳动,帮助提 ...

  5. git clone报错

    (文章是从我的个人主页上粘贴过来的,大家也可以访问我的主页 www.iwangzheng.com) Could not chdir to home directory /home/wangzheng: ...

  6. 转:PCL+VS2010环境配置

    1.下载 http://www.pointclouds.org/downloads/windows.html出下载PCL完全安装包1.6.0 all-in-one-installer,我的电脑是32位 ...

  7. 绕过 <?PHP exit('Access Denied'); ?> 限制

    绕过 <?PHP exit('Access Denied'); ?> 限制   <?php $shellcode='PD9waHBpbmZvKCk7Pz4';//   base64_ ...

  8. SSM框架Web程序的流程(Spring SpringMVC Mybatis)

    SSM框架的Web程序主要用到了三个技术: Spring:用到了注解和自动装配,就是Spring的两个精髓IOC(反向控制)和 AOP(面向切面编程). SpringMVC:用到了MVC模型,将逻辑代 ...

  9. 【OpenStack】OpenStack系列14之Dashboard定制开发

    django概述 参考资料:http://blog.javachen.com/2014/01/11/how-to-create-a-django-site.html http://djangobook ...

  10. JAVA接口继承、抽象类等

    1.定义接口 package test.intefaces; public interface TestIntefaceA { void testA(); void testB(); void tes ...