栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

浅谈JavaScript 的执行顺序

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

浅谈JavaScript 的执行顺序

虽然现代浏览器可以并行的下载Javascript(部分浏览器),但考虑到Javascript的依赖关系,他们的执行依然是按照引入顺序进行的。

本文章记录本人在学习 Javascript 中看书理解到的一些东西,加深记忆和并且整理记录下来,方便之后的复习。

在 html 文档中的执行顺序

js代码执行顺序比较的形象,用户可以直观的感受这种执行顺序。但是,js代码的执行顺序是比较复杂的。有时候我们会把js代码写在html里面,而html文档在浏览器中解析的过程是这样:浏览器按照文档流从上到下逐步解析页面结构和信息。js代码作为嵌入的脚本也算做html文档的组成部分,因此,js代码在装载时的执行顺序也是根据脚本标签 document

还有对于通过脚本标签 // 然后在按顺序执行下面的代码

预编译

当js引擎解析的时候,它会在预编译对所有声明的变量和函数进行处理。

变量提升

console.log(a); // undefined
var a = 1;
console.log(a); // 1

预解析函数

f(); // 1
function f() {
  console.log(1);
};

详细:javascript变量声明提升(hoisting)

分块执行代码

js是按块执行代码的,所谓代码块就是使用

因为js是按代码块来执行的。浏览器在解析html文档流的时候,如果遇到一个

由于js是按块处理代码,同时又遵循html文档流的解析顺序,因此在上面的栗子中会看到语法错误。但是,在文档流加载完毕后再次访问就不会出现这种错误了。(下面一个栗子)



还有为了安全起见,一般在页面初始化完毕之后才允许js代码执行,这样就可以避免一些网速对js执行的影响。同时,也避开了html文档流对js执行的限制。

综上所述,javascript在执行时的步骤是:

1、先读入第一段代码块

2、对代码块进行语法分析,如果出现语法错误,直接执行第5步骤

3、对var变量和function定义的函数进行“预编译处理”(赋值式函数是不会进行预编译处理的)

4、执行代码块,有错则报错

5、如果还有下一段代码块,则读入下一段代码块,重复步骤2

6、结束

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/101305.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号