浅析JavaScript预编译和暗示全局变量


Posted in Javascript onSeptember 03, 2020

1. 暗示全局变量

未声明的变量称为暗示全局变量。

var a = 1; //函数体外声明的变量称为全局变量
b = 2; // 无论函数体外或函数体内未声明的变量都称为暗示全局变量
function fn() {
 var c = 3; //函数体内声明的变量称为局部变量
 d = 4; // 暗示全局变量
}
fn(); // 若不执行函数,则不会进行函数预编译,d 就不会提升为全局变量
console.log(c); // error: c is not defined
console.log(d); // 4

2. JavaScript执行过程

1. 语法分析,若存在低级语法错误,则不编译执行;
2. 预编译,包括变量声明提前和函数声明提前;
3. 解释执行,解释一行,执行一行。

3. 预编译

预编译可分为全局预编译和函数预编译。

预编译可分为全局预编译和函数预编译。

1. 在js脚本加载之后,会先通篇检查是否存在低级错误;
2. 在语法检测完之后,便进行全局预编译;
3. 在全局预编译之后,就解释一行,执行一行;
4. 当执行到函数调用那一行,会先进行函数预编译,再往下执行。

全局预编译:

1. 创建全局对象GO(window对象);
2. 变量声明提前,将所有变量的声明放到最前面,作为GO对象的属性,
并赋值undefined,若存在变量名相同,只声明一个;
3. 函数声明提前,将函数声明也放到最前面,作为GO对象的属性,
若函数名与变量名相同,变量名会被函数名覆盖,值是函数体。
这就是函数定义放到函数调用之前或之后都可以的原因。

函数预编译:

1. 在函数执行前的一瞬间,函数预编译闪亮登场;
2. 先创建一个AO对象(Active Object);
3. 将形参和变量声明提前,赋值undefined,作为AO的属性;
4. 将实参赋值给形参;
5. 函数声明提前,值为函数体,作为AO的属性。

栗子:

var a = 1;
function b(c){
 console.log(c);
 var c = 2;
 console.log(c);
 function c() {}
 var d = 3;
 function e() {}
}
b(4);

先分析全局预编译,

  • 创建GO对象,GO = {};
  • 变量声明提前
// 伪代码
GO = { 
 a = undefined
}
  • 函数声明提前
// 伪代码
GO = { 
 a = undefined
 b = f b(c) { console.log(c); ... }
}

再分析函数预编译,

  • 创建AO对象,AO = {};
  • 形参和变量声明提前;

// 伪代码
AO = { 
c = undefined // 与变量名相同,只声明一个
d = undefined
}
  • 将实参赋值给形参;
// 伪代码
AO = { 
c = 4 // b(4),传入的实参是4
d = undefined
}

  • 函数声明提前

// 伪代码
AO = { 
c = f c() {} // 函数名会覆盖变量名
d = undefined
e = f e() {}
}

所以第一次打印变量c的时候,是输出函数体,而不是实参4。

以上就是浅析JavaScript预编译和暗示全局变量的详细内容,更多关于JavaScript预编译和暗示全局变量的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
禁用页面部分JavaScript不是全部而是部分
Sep 03 Javascript
jquery中show()、hide()和toggle()用法实例
Jan 15 Javascript
javascript带回调函数的异步脚本载入方法实例分析
Jul 02 Javascript
jQuery实现简单的点赞效果
May 29 Javascript
jQuery使用$.each遍历json数组的简单实现方法
Apr 18 Javascript
jQuery点击导航栏选中更换样式的实现代码
Jan 23 Javascript
微信JS-SDK选取手机照片上传功能
Apr 21 Javascript
js设置随机切换背景图片的简单实例
Nov 12 Javascript
详解javascript函数写法大全
Mar 25 Javascript
Node.js+Express+Mysql 实现增删改查
Apr 03 Javascript
mpvue微信小程序的接口请求fly全局拦截代码实例
Nov 13 Javascript
JavaScript Window窗口对象属性和使用方法
Jan 19 Javascript
详解JavaScript作用域、作用域链和闭包的用法
Sep 03 #Javascript
JS变量提升及函数提升实例解析
Sep 03 #Javascript
Vue自定义组件双向绑定实现原理及方法详解
Sep 03 #Javascript
Vue js with语句原理及用法解析
Sep 03 #Javascript
Vue通过provide inject实现组件通信
Sep 03 #Javascript
Vue组件通信$attrs、$listeners实现原理解析
Sep 03 #Javascript
Vue父组件监听子组件生命周期
Sep 03 #Javascript
You might like
php中数据的批量导入(csv文件)
2006/10/09 PHP
php数据库连接
2006/10/09 PHP
解决MySQL中文输出变成问号的问题
2008/06/05 PHP
PHP调用Twitter的RSS的实现代码
2010/03/10 PHP
PHP实现变色验证码实例
2014/01/06 PHP
phpmyadmin配置文件现在需要绝密的短密码(blowfish_secret)的2种解决方法
2014/05/07 PHP
Mootools 1.2教程 Fx.Morph、Fx选项和Fx事件
2009/09/15 Javascript
js带按钮的提示框可供选择示例代码
2013/09/17 Javascript
JavaScript 实现鼠标拖动元素实例代码
2014/02/24 Javascript
js unicode 编码解析关于数据转换为中文的两种方法
2014/04/21 Javascript
Javascript访问器属性实例分析
2014/12/30 Javascript
浅谈document.write()输出样式
2015/05/07 Javascript
chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式
2015/10/09 Javascript
原生js获取元素样式的简单方法
2016/08/06 Javascript
JS基于递归实现倒计时效果的方法
2016/11/26 Javascript
canvas实现动态小球重叠效果
2017/02/06 Javascript
微信小程序使用modal组件弹出对话框功能示例
2017/11/29 Javascript
nodejs实现获取本地文件夹下图片信息功能示例
2019/06/22 NodeJs
Nodejs + Websocket 指定发送及群聊的实现
2020/01/09 NodeJs
python调用cmd命令行制作刷博器
2014/01/13 Python
pycharm 使用心得(五)断点调试
2014/06/06 Python
轻松理解Python 中的 descriptor
2017/09/15 Python
Python3用tkinter和PIL实现看图工具
2018/06/21 Python
python实现批处理文件
2020/07/28 Python
HTML5 Canvas基本线条绘制的实例教程
2016/03/17 HTML / CSS
Spartoo瑞典:鞋子、包包和衣服
2018/09/15 全球购物
亚洲领先的旅游体验市场:Voyagin
2019/11/23 全球购物
中科创达面试题
2016/12/28 面试题
技校个人求职信范文
2014/01/25 职场文书
护士试用期自我鉴定
2014/02/08 职场文书
给学校的建议书范文
2014/05/15 职场文书
2014机关党员干部“正风肃纪”思想汇报
2014/09/15 职场文书
群众路线教育实践活动整改落实情况汇报
2014/10/28 职场文书
无工作证明怎么写
2015/06/15 职场文书
捐书仪式主持词
2015/07/04 职场文书
《夜莺的歌声》教学反思
2016/02/22 职场文书