浅析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 相关文章推荐
THREE.JS入门教程(4)创建粒子系统
Jan 24 Javascript
JS+CSS实现模仿浏览器网页字符查找功能的方法
Feb 26 Javascript
javascript实现动态改变层大小的方法
May 14 Javascript
JavaScript制作淘宝星级评分效果的思路
Jun 23 Javascript
深入浅析Node.js 事件循环
Dec 20 Javascript
javascript瀑布流式图片懒加载实例解析与优化
Feb 23 Javascript
jQuery实现为LI列表前3行设置样式的方法【2种方法】
Sep 04 Javascript
jquery 实现复选框的全选操作实例代码
Jan 24 Javascript
React Native 集成jpush-react-native的示例代码
Aug 16 Javascript
原生JavaScrpit中异步请求Ajax实现方法
Nov 03 Javascript
VueRouter导航守卫用法详解
Dec 25 Javascript
vue获取dom元素注意事项
Dec 28 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 visitFile()遍历指定文件夹函数
2010/08/21 PHP
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
PHP SESSION的增加、删除、修改、查看操作
2015/03/20 PHP
php curl上传、下载、https登陆实现代码
2017/07/23 PHP
PHP文件系统管理(实例讲解)
2017/09/19 PHP
通过源码解析Laravel的依赖注入
2018/01/22 PHP
使用新的消息弹出框blackbirdjs
2008/10/16 Javascript
xss文件页面内容读取(解决)
2010/11/28 Javascript
JavaScript中的面向对象介绍
2012/06/30 Javascript
JS中不为人知的五种声明Number的方式简要概述
2013/02/22 Javascript
js实现鼠标拖动图片并兼容IE/FF火狐/谷歌等主流浏览器
2013/06/06 Javascript
用JS做的简单的可折叠的两级树形菜单
2013/09/21 Javascript
JS跨域问题详解
2014/11/25 Javascript
js实现下拉列表选中某个值的方法(3种方法)
2015/12/17 Javascript
AngularJS中的Directive自定义一个表格
2016/01/25 Javascript
javaScript封装的各种写法
2017/08/14 Javascript
vue学习笔记之v-if和v-show的区别
2017/09/20 Javascript
select获取下拉框的值 下拉框默认选中方法
2018/02/28 Javascript
详解小程序不同页面之间通讯的解决方案
2018/11/23 Javascript
Python解析网页源代码中的115网盘链接实例
2014/09/30 Python
用Python将一个列表分割成小列表的实例讲解
2018/07/02 Python
对python操作kafka写入json数据的简单demo分享
2018/12/27 Python
Python range、enumerate和zip函数用法详解
2019/09/11 Python
Django多进程滚动日志问题解决方案
2019/12/17 Python
Python操作MySQL数据库实例详解【安装、连接、增删改查等】
2020/01/17 Python
如何通过python实现全排列
2020/02/11 Python
梅西百货澳大利亚:Macy’s Australia
2017/07/26 全球购物
印度化妆品购物网站:Nykaa
2018/07/22 全球购物
澳大利亚领先的折扣药房:Chemist Direct(有中文站)
2018/11/24 全球购物
什么是托管函数?托管函数有什么用?
2014/06/15 面试题
大学生通用个人自我评价
2014/04/27 职场文书
开展党的群众路线教育实践活动剖析材料
2014/10/13 职场文书
赔偿协议书
2015/01/27 职场文书
幼儿园2015年度工作总结
2015/04/01 职场文书
高中优秀作文(范文)
2019/08/15 职场文书
Python Matplotlib库实现画局部图
2021/11/17 Python