浅析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网页制作特殊效果用随机数
May 22 Javascript
javascript获得服务器端控件的ID的实现代码
Dec 28 Javascript
JavaScript的null和undefined区别示例介绍
Sep 15 Javascript
JS实现简单的图书馆享元模式实例
Jun 30 Javascript
jQuery+PHP星级评分实现方法
Oct 02 Javascript
jQuery EasyUI 页面加载等待及页面等待层
Feb 06 Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
Apr 05 Javascript
基于easyui checkbox 的一些操作处理方法
Jul 10 Javascript
vue项目中axios使用详解
Feb 07 Javascript
vue2实现搜索结果中的搜索关键字高亮的代码
Aug 29 Javascript
小程序实现人脸识别功能(百度ai)
Dec 23 Javascript
layui-tree实现Ajax异步请求后动态添加节点的方法
Sep 23 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图片上传类带图片显示
2006/11/25 PHP
Apache+php+mysql在windows下的安装与配置图解(最新版)
2008/11/30 PHP
javascript 对象的定义方法
2007/01/10 Javascript
event.keyCode键码值表 附只能输入特定的字符串代码
2009/05/15 Javascript
跨浏览器开发经验总结(四) 怎么写入剪贴板
2010/05/13 Javascript
asm.js使用示例代码
2013/11/28 Javascript
IE6-8中Date不支持toISOString的修复方法
2014/05/04 Javascript
JavaScript中的toUTCString()方法使用详解
2015/06/12 Javascript
javascript字符串循环匹配实例分析
2015/07/17 Javascript
Javascript中数组去重与拍平的方法示例
2017/02/03 Javascript
教你快速搭建Node.Js服务器的方法教程
2017/03/30 Javascript
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
聊聊JS动画库 Velocity.js的使用
2018/03/13 Javascript
微信开发之微信jssdk录音功能开发示例
2018/10/22 Javascript
vue组件开发props验证的实现
2019/02/12 Javascript
elementUi vue el-radio 监听选中变化的实例代码
2019/06/28 Javascript
vue实现图片按比例缩放问题操作
2020/08/11 Javascript
VSCode 添加自定义注释的方法(附带红色警戒经典注释风格)
2020/08/27 Javascript
[01:04:31]DOTA2-DPC中国联赛定级赛 iG vs Magma BO3第二场 1月8日
2021/03/11 DOTA
python 构造三维全零数组的方法
2018/11/12 Python
python pygame实现2048游戏
2018/11/20 Python
PyQt5实现简单数据标注工具
2019/03/18 Python
python使用wxpy实现微信消息防撤回脚本
2019/04/29 Python
Python实现石头剪刀布游戏
2021/01/20 Python
Java的五个基础面试题
2016/02/26 面试题
上海奥佳笔试题面试题
2016/11/16 面试题
结构工程研究生求职信
2013/10/13 职场文书
车间班组长岗位职责
2013/11/13 职场文书
环保口号大全
2014/06/12 职场文书
安全在我心中演讲稿
2014/09/01 职场文书
2014年信息中心工作总结
2014/12/17 职场文书
2015小学教师德育工作总结
2015/05/12 职场文书
公务员爱岗敬业心得体会
2016/01/25 职场文书
Oracle11g R2 安装教程完整版
2021/06/04 Oracle
html5+实现plus.io进行拍照和图片等获取
2022/06/01 HTML / CSS
Win11 vmware不兼容怎么办?Win11与VMware虚拟机不兼容的解决方法
2023/01/09 数码科技