您的位置：首页 > Web前端 > JavaScript
JavaScript代码内部执行顺序

2013-07-30 11:39 330 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
//1.页面加载的时候，浏览器会对页面上的或载入的js代码块（或文件）进行扫描，如果遇到定义式函数和显示定义的变量，则对此函数和显示定义的变量进行预编译，处理完成后再由上至下执行；遇到赋值式函数则只是将函数赋值给一个变量，不进行预处理，待调用到的时候才进行处理

f1(); //我是f1方法
//“定义式”函数定义
function f1() {
alert('我是f1方法');
}

//“赋值式”函数定义
f2(); //报错，浏览器未对f2进行预处理，则依次执行
//代码报错后，次块中的代码不再向下执行，执行下一个块中的代码
var f2 = function () {
alert('我是f2方法');
};
f2(); //此句代码没有执行

</script>
<!--2.浏览器对每个块或文件进行独立的扫描，然后再对全局的代码进行顺序执行，所以在一个块中是，定义式函数可以在函数调用后定义，但在两个js代码块中时，定义函数所在的块必须在函数被调用的块之前-->
<script type="text/javascript">
f3();//报错
</script>
<script type="text/javascript">
function f3() {
alert('我是f3方法');
}
</script>
<script type="text/javascript">
f3(); //我是f3方法
</script>
<!--3.重复定义的函数会覆盖前面的定义-->
<script type="text/javascript">
f4();//我是第二个f4方法
function f4() {
alert('我是第一个f4方法');
}
f4(); //我是第二个f4方法
function f4() {
alert('我是第二个f4方法');
}
f4(); //我是第二个f4方法
</script>
<!--4.body内部的函数会先于body的onload函数执行-->
<script type="text/javascript">
function f5() {
alert('我是body的onload的f5方法');
}
</script>
<!--5.严格来说，javascript是没有多线程概念的，所有的程序都是单线程依次执行的-->
<script type="text/javascript">
function f6() {
setInterval(function () {
alert('我先调用');
}, 1000);
}
function f7() {
alert('我后调用')
}
f6();
f7();
//先弹出：我后调用
//1秒后弹出：我先调用
//看上去像是f6（）与延时程序分两个过程走，但其实，这事javascript的“回调”机制在起作用，类似于操作系统的“中断和响应”---延时程序处设置一个中断，然后执行f7（），待1秒后，再回调f6（）；
</script>
</head>
<body onload="f5()">
<script type="text/javascript">
alert('我是body内部的代码');
</script>
<input type="button" name="name" value="点击我 " onclick="alert('我是button的点击事件')" />
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理
标签：
相关文章推荐
新的分享
章节导航