JavaScript代码内部执行顺序
<!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>
JavaScript代码内部执行顺序的更多相关文章
- 《浏览器工作原理与实践》<07>变量提升:JavaScript代码是按顺序执行的吗?
讲解完宏观视角下的浏览器后,从这篇文章开始,我们就进入下一个新的模块了,这里我会对 JavaScript 执行原理做深入介绍. 今天在该模块的第一篇文章,我们主要讲解执行上下文相关的内容.那为什么先讲 ...
- php课程 1-3 web项目中php、html、js代码的执行顺序是怎样的(详解)
php课程 1-3 web项目中php.html.js代码的执行顺序是怎样的(详解) 一.总结 一句话总结:b/s结构 总是先执行服务器端的先.js是客户端脚本 ,是最后执行的.所以肯定是php先执行 ...
- 创建HttpFilter与理解多个Filter代码的执行顺序
1.自定义的HttpFilter,实现Filter接口 HttpFilter package com.aff.filter; import java.io.IOException; import ja ...
- JavaScript程序的执行顺序
JavaScript程序的执行顺序:同步==>异步==>回调 同步是阻塞模式,异步是非阻塞模式. 同步就是指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个 ...
- 通过指令码来判断Java代码的执行顺序(++问题与return和finally的问题)
问题 在<深入理解Java虚拟机>一书中遇到了如下代码: public int method() { int i; try { i = 1; return i; } catch (Exce ...
- 关于JavaScript代码的执行效率总结
Javascript是一门非常灵活的语言,我们可以随心所欲的书写各种风格的代码,不同风格的代码也必然也会导致执行效率的差异,开发过程中零零散散地接触到许多提高代码性能的方法,整理一下平时比较常见并且容 ...
- java代码块执行顺序
父类 public class Father { public Father() { System.out.println("父类构造PUBLIC father"); } stat ...
- 2018.11.20-day22 类中代码的执行顺序&组合
1.类中代码的执行顺序 2.组合
- Java基础系列5:Java代码的执行顺序
该系列博文会告诉你如何从入门到进阶,一步步地学习Java基础知识,并上手进行实战,接着了解每个Java知识点背后的实现原理,更完整地了解整个Java技术体系,形成自己的知识框架. 一.构造方法 构造方 ...
随机推荐
- bzoj2402 陶陶的难题II 分数规划+树剖+线段树维护凸壳+二分
题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=2402 题解 看上去很像分数规划的模型.于是就二分吧.令 \[ \begin{align*}\f ...
- BZOJ 5046 分糖果游戏
网页崩溃了 心态也崩溃了 MD劳资写了那么多 题意: 有a,b两个人分糖,每个人都有一个能量值.每个人每一轮可以选择进行两种操作: 1.取走最左边的糖果,补充相应的能量值并获取相应的美味度. 2.跳过 ...
- 什么是Js原型?(1)(包括作用:继承)
学习目标: 认识什么js是原型,原型.构成函数.实例对象关系:原型应用范围. 什么是原型 函数有原型,函数有一个属性叫prototype,函数的这个原型指向一个对象,这个对象叫原型对象.这 ...
- Spring MVC (二)
一.使用 @RequestMapping 映射请求 Spring MVC使用@RequestMapping注解为控制器指定可以处理哪些URL请求 在控制器的类定义以及方法定义处都可以标注 类定义处:提 ...
- DELPHI 调试IOS时出现 Please specify exact device preset UUID
右击设备DEVICE, 选择REFRESH刷新, 再重新选择一个设备即可.
- JLRoutes笔记
1.在info.plist中添加 <key>CFBundleURLTypes</key> <array> <dict> <key>CFBun ...
- BZOJ 4836: [Lydsy1704月赛]二元运算 分治FFT
Code: #include<bits/stdc++.h> #define ll long long #define maxn 500000 #define setIO(s) freope ...
- Leetcode_132. Palindrome Partitioning II_[DP]
题目链接 Given a string s, partition s such that every substring of the partition is a palindrome. Retur ...
- composer proc_open(): fork failed – Cannot allocate memory
一般小的VPS 才1G内存,如果使用composer会提示内存不足的现象 解决办法,可以使用交换内存 直接命令 /bin/dd if=/dev/zero of=/var/swap.1 bs=1M co ...
- 麦子lavarel---16、日志
麦子lavarel---16.日志 一.总结 一句话总结: 一定要养成打印日志查看日志的好习惯,非常节约时间和便于查错 1.console.Log(“获取类别数据:"):console.Lo ...