Javascript执行步骤与顺序 -

huangyongxing310

浏览: 495889 次
性别:
来自: 广州

最近访客更多访客>>

hiroada

lixiaoxin

u012363178

wangyy

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

Javascript执行步骤与顺序

博客分类：

JavaScript

Javascript执行步骤与顺序

Javascript执行步骤与顺序

1.JavaScript是单线程

执行步骤:
step 1. 读入第一个代码块（以<script>指令串</script>）。
step 2. 做语法分析，有错则报语法错误（比如括号不匹配等），并跳转到step5。
step 3. 对var变量和function定义做“预编译处理”（永远不会报错的，因为只解析正确的声明）。
step 4. 执行代码段，有错则报错（比如变量未定义）。
step 5. 如果还有下一个代码段，则读入下一个代码段，重复step2。
step6. 结束。

执行原理:
（1）所有任务都在主线程上执行，形成一个执行栈（execution context stack）。
（2）主线程之外，还存在一个"任务队列"（task queue）。系统把异步任务放到"任务队列"之中，然后继续执行后续的任务。
（3）一旦"执行栈"中的所有任务执行完毕，系统就会读取"任务队列"。如果这个时候，异步任务已经结束了等待状态，就会从"任务队列"进入执行栈，恢复执行。
（4）主线程不断重复上面的第三步。

执行栈中的代码，总是在读取"任务队列"之前执行。

执行顺序:
1.而根据HTML文档流的执行顺序，需要在页面元素渲染前执行的js代码应该放在<body>前面的<script>代码块中
2.需要在页面元素加载完后执行的js放在</body>元素后面，body标签的onload事件是在最后执行的。

<script type="text/javascript">
    alert("first");
    function Fn(){
        alert("third");
    }
</script>
<body onload="Fn()"> //onload事件是在最后执行的

</body>
<script type="text/javascript">
    alert("second");
</script>

body内部的函数会先于onload的函数执行

//html head...
<script type="text/javascript">
function fnOnLoad(){
alert("I am outside the Wall!");
}
</script>
<body onload="fnOnLoad();">
<script type="text/javascript">
alert("I am inside the Wall..");
</script>
</body>
//先弹出“I am inside the Wall..”;
//后弹出“I am outside the Wall!”

JavaScript是单线程
1.你肯定要问：那延时执行、Ajax异步加载，不是多线程的吗？
下面这样的程序确实看起来像“多线程”：

function fn1(){
setTimeout(function(){
alert("我先调用")
},1000);
}
function fn2(){
alert("我后调用");
}
fn1();
fn2();
// 先弹出：“我后调用”，
// 1秒后弹出：“我先调用”

看上去，fn2()和延时程序是分两个过程再走，但其实，这是JavaScript中的“回调”机制在起作用，类似于操作系统
中的“中断和响应” —— 延时程序设置一个“中断”，然后执行fn2()，待1000毫秒时间到后，再回调执行fn1()。

参考原文：http://www.admin10000.com/document/3752.html
参考原文：http://www.cnblogs.com/zxj159/archive/2013/05/17/3084598.html

分享到：

java ReentrantLock应用 | kafka java原生简单应用

2016-09-26 01:09
浏览 408
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Javascript执行步骤与顺序

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Javascript执行步骤与顺序

评论

发表评论

相关推荐

定时调用函数功能实现

uniApiJs

百度人脸识别

点击DIV触发上传文件的方法

前端格式化工具与检测工具选择与使用

indexedDb TEST

defineProperty Array push 监听

weuiJsLayer.js

dataViewCommonJs

editorconfig配置

commonJs

setFormData

高德地图获取地址

前端实现从剪贴板中获取数据

js prototype原理与使用

JS过滤树数据

javascript匿名函数与闭包

JavaScript 作用域和作用域链

Javascript函数

URI和URL的区别、URL编码

最近访客更多访客>>