JavaScript运行过程中的“预编译阶段”和“执行阶段”


Posted in Javascript onDecember 16, 2015

 javascript相对于其它语言来说是一种弱类型的语言,在其它如java语言中,程序的执行需要有编译的阶段,而在javascript中也有类似的“预编译阶段”(javascript的预编译是以代码块为范围<script></script>,即每遇到一个代码块都会进行  预编译>执行),了解javascript引擎的执行机理,将有助于在写js代码过程中的思路总结

首先科普下javascript中的两种声明方式,var和function,前者声明的是变量,后者声明的是方法

在预编译中,javascript对这两种声明做出了两种处理方案

<script>
var a = "1";

//声明变量a
 function b(){

//声明方法b
  
alert();

}

var c = function(){ //声明变量c


alert();

}
</script>

以上代码块中,a、c为变量赋值,b为函数声明,当执行以上的代码时,首先会进入预编译阶段,对与变量赋值a、c会在内存中开辟一块内存空间并指向变量名,且赋值为undefined

对于函数声明,则同样会进行开辟内存空间,但赋值的对象会将声明的函数赋值给函数名

预编译阶段:(PS:不管代码中声明变量和声明函数的顺序如何,在预编译阶段会先声明变量,再声明函数)

<script>

var a = undefined;


var c = undefined;

 

var b = function(){



alert();


} </script>

 执行阶段:

<script>

a = "1";


c = function(){



alert();


}
</script>

整体执行步骤:

<script>

var a = undefined;


var c = undefined;





var b = function(){



alert();


}


a = "1";


c = function(){



alert();


}
</script>

题目:

<script>

var a = "1";


function b(){



alert(a);



var a = "2";


}


b();
</script>

ps:javascript的预编译

     一、先预定义变量,再预定义函数

二、变量的预编译只作声明,不作初始化,初始化在执行时

 

三、function语句定义的函数,不仅声明了函数名,而且函数体也进行了处理

四、匿名函数不会预编译

function f(){      // 声明函数f  
return 1; } alert(f());       // 返回1 
var f = function(){    // 定义匿名函数f  
return 2; } alert(f());       // 返回2

先预定义了变量f,然后同名函数f()覆盖了变量f,所以第一次输出1;变量的预编译

var f = function(){    // 定义匿名函数f  
return 1; } 
alert(f());       // 返回1 
function f(){      // 声明函数f  
return 2; } 
alert(f());      // 返回1

先预定义了变量f,然后同名函数f()覆盖了变量f.

Javascript 相关文章推荐
sina的lightbox效果。
Jan 09 Javascript
javascript分页代码实例分享(js分页)
Dec 13 Javascript
jquery中each方法示例和常用选择器
Jul 08 Javascript
在Node.js中使用HTTP上传文件的方法
Jun 23 Javascript
Jquery+Ajax+PHP+MySQL实现分类列表管理(下)
Oct 28 Javascript
Javascript中Date类型和Math类型详解
Feb 27 Javascript
jQuery简单实现仿京东分类导航层效果
Jun 07 Javascript
Vue.js第一天学习笔记(数据的双向绑定、常用指令)
Dec 01 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
Mar 05 Javascript
JS实现处理时间,年月日,星期的公共方法示例
May 31 Javascript
JS Html转义和反转义(html编码和解码)的实现与使用方法总结
Mar 10 Javascript
javascript实现的图片预览和上传功能示例【兼容IE 9】
May 01 Javascript
Sublime Text 3常用插件及安装方法
Dec 16 #Javascript
基于MVC4+EasyUI的Web开发框架形成之旅之界面控件的使用
Dec 16 #Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 #Javascript
javascript基于prototype实现类似OOP继承的方法
Dec 16 #Javascript
javascript数组克隆简单实现方法
Dec 16 #Javascript
Perl Substr()函数及函数的应用
Dec 16 #Javascript
javascript针对不确定函数的执行方法
Dec 16 #Javascript
You might like
Zend Framework页面缓存实例
2014/06/25 PHP
PHP使用pcntl_fork实现多进程下载图片的方法
2014/12/16 PHP
Yii核心验证器api详解
2016/11/23 PHP
php验证码生成器
2017/05/24 PHP
javascript 对表格的行和列都能加亮显示
2008/12/26 Javascript
Javascript 判断Flash是否加载完成的代码
2010/04/12 Javascript
JQuery slideshow的一个小问题(如何发现及解决过程)
2013/02/06 Javascript
jQuery的attr与prop使用介绍
2013/10/10 Javascript
JQUERY dialog的用法详细解析
2013/12/19 Javascript
在JavaScript中用getMinutes()方法返回指定的分时刻
2015/06/10 Javascript
浅谈Javascript实现继承的方法
2015/07/06 Javascript
vuejs在解析时出现闪烁的原因及防止闪烁的方法
2016/09/19 Javascript
Vuex之理解Mutations的用法实例
2017/04/19 Javascript
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
React教程之Props验证的具体用法(Props Validation)
2017/09/04 Javascript
ReactJS实现表单的单选多选和反选的示例
2017/10/13 Javascript
用ES6写全屏滚动插件的示例代码
2018/05/02 Javascript
Vue 中的受控与非受控组件的实现
2018/12/17 Javascript
Vue使用Proxy监听所有接口状态的方法实现
2019/06/07 Javascript
nodejs nedb 封装库与使用方法示例
2020/02/06 NodeJs
Python中实现参数类型检查的简单方法
2015/04/21 Python
CentOS 6.5下安装Python 3.5.2(与Python2并存)
2017/06/05 Python
python pandas 对series和dataframe的重置索引reindex方法
2018/06/07 Python
用uWSGI和Nginx部署Flask项目的方法示例
2019/05/05 Python
Python爬虫爬取百度搜索内容代码实例
2020/06/05 Python
python飞机大战游戏实例讲解
2020/12/04 Python
纯CSS3绘制打火机动画火焰效果
2016/07/18 HTML / CSS
CSS3实现头像旋转效果
2017/03/13 HTML / CSS
万豪国际住宅与别墅集团:Homes & Villas by Marriott International
2020/10/08 全球购物
正隆泰信息技术有限公司上机题
2012/06/14 面试题
建筑工程自我鉴定
2013/10/18 职场文书
音乐学个人的自荐书范文
2013/11/26 职场文书
员工安全承诺书
2014/05/22 职场文书
秋菊打官司观后感
2015/06/03 职场文书
2019开业庆典剪彩仪式主持词!
2019/07/22 职场文书
CSS 制作波浪效果的思路
2021/05/18 HTML / CSS