JS预编译过程
GO和AO
变量的预编译
实例1
console.log(a);
var a=1;
console.log(a);
实际编译过程:
将a存入预编译对象中,赋值为undefined;
真正的赋值语句当程序运行到时才会执行。
实例1等价:
var a=undefined;
console.log(a);//undefined
a=1;
console.log(a);//1
GO(Global Object)
预编译过程
先创建GO对象(Global Object),再创建AO对象(Activation Object)。
GO:先不看函数内部的代码
- 创建GO对象;
- 找 变量声明,将 变量 作为GO属性名,值为undefined;
- 再找 函数声明,值赋予函数体;
GO对象创建完成,开始读代码,直到读到全局调用test函数时,函数预编译,开始创建AO对象(预编译发生在函数执行的前一刻)
实例2
console.log(test); //function
function test(test) {
console.log(test);
var test = 234;
console.log(test);
function test() {}
}
test(1);
var test = 123;//test=123 覆盖属性test:function
console.log(test);//123
创建GO对象;
GO { }
找 变量声明,将 变量 作为GO属性名,值为undefined;
GO {
test : undefined
}
再找 函数声明,值赋予函数体;
GO {
test : function test(test) {
// … 整个函数体 }
}
GO对象创建完成,开始读代码,直到读到全局调用test函数时,函数预编译,开始创建AO对象(预编译发生在函数执行的前一刻)
AO(activation object )
全称:活跃对象/执行期上下文,在函数执行前执行函数预编译,此时会产生一个AO对象,AO对象保存该函数的参数变量。
函数预编译步骤:
- 产生AO对象
- 将函数的形参和函数内声明的变量当作AO对象的属性名,值全为undefined。变量的赋值在原先的位置
- 将实参赋值给形参属性
- 在函数内声明的函数,函数名作为OA的属性名,函数体赋值给值。(若函数名和变量重名,函数体会覆盖原先的变量值)
实例3
function test(a) {
console.log(a);
var a = 2;
console.log(a);
function a () {}
console.log(a);
var b = function () {};
console.log(b);
function d(){}
}
test(1);
1. 创建AO对象
AO{
//此时AO对象为空
}
2. 确定AO对象的属性名
AO{
a:undefined; //函数参数
b:undefined; //函数里面声明的变量
}
3. 将实参值赋值给形参
AO{
a:1; //函数参数
b:undefined; //函数里面声明的变量
}
4. 处理函数里面的声明函数
var b=function( ){ };时不会把函数体给到b属性的。b仍然是undefined.
function a( ){ }; 才会覆盖a属性。
AO{
a:function a () {} //变量名一样,值覆盖
b:undefined, //函数里面声明的变量
d:function d () {}
}
function test(a) {
console.log(a);//function a;
var a = 2;//a=2; 覆盖AO中的属性值
console.log(a); //2;
function a () {} //预编译时已经处理过了,直接跳过
console.log(a); //2
console.log(b); //undefined; bs变量 尚未赋值
var b = function () {};//b=function(){}; 覆盖
console.log(b);//function (){};
function d(){}
}
test(1);
JS预编译过程的更多相关文章
- js预编译
先来做三个测试 eg1: var a; a = 1; function a() {}; console.log(a); eg2: var a; function a() {}; console.log ...
- JS预编译详解
我们都知道javascript是解释型语言,执行的特点呢是编译一行,执行一行.按照这个思路有时候我们在运行代码时会有一些令人费解的现象出现.下面我们一起来执行下面三段代码. <script> ...
- js 预编译
js 运行代码的时候分为几个步骤:语法分析 ==>预编译 ==>解释执行 语法解析:通篇扫描代码,查看语法是否出错 解释执行:读一行 - 解释一行 - 执行一行 预编译执行的操作: // ...
- Handlebars.js 预编译(转)
Handlebars.js 官网上对预编译1是这样说的: 你需要安装 Node.js 你需要在全局环境中,通过 Npm 安装 handlebars 包 然后你就可以通过命令预编译你的 handleba ...
- javaScript 预编译过程浅尝
javaScript 预编译过程 1.创建AO对象(Activation Object) AO{ a: } 2.找形参和变量声明,将变量和形参作为AO属性名,值为undefined AO{ a:und ...
- 关于js预编译以及js文件执行顺序的几个问题。
关于js的执行原理,除去html页面中直接添加的代码,js代码的放置可以分为两类. //情形a <script type="text/javascript" ...
- js预编译和函数执行
javascript 执行过程 1.语法检测(有没有基本的语法错误,例如中文,关键字错误...)2.词法分析(预编译) (1)创建全局GO(global object)对象 (2)对var声明的变量进 ...
- C语言的预编译,程序员必须懂的知识!【预编译指令】【预编译过程】
由“源代码”到“可执行文件”的过程包括四个步骤:预编译.编译.汇编.链接.所以,首先就应该清楚的首要问题就是:预编译只是对程序的文本起作用,换句话说就是,预编译阶段仅仅对源代码的单词进行变换,而不是对 ...
- js预编译的四部曲
众所周知javascript是解释性语言,主要特点为解释一行执行一行. 而在js运行时会进行三件事:1语法分析 2.预编译 3.解释执行 语法分析会在代码执行前对代码进行通篇检查,以排除一些低级错 ...
随机推荐
- 启动或重启Oracle数据以及监听
(以下均为命令行形式) 1.切换到oracle数据库用户: su - oracle 2.查看数据库的监听状态: lsnrctl status 3.停止监听: lsnrctl stop 4.登陆到ora ...
- SpringCloud升级之路2020.0.x版-14.UnderTow AccessLog 配置介绍
本系列代码地址:https://github.com/HashZhang/spring-cloud-scaffold/tree/master/spring-cloud-iiford server: u ...
- Golang语言系列-02-常用数据类型
Go语言常用数据类型 Go 语言中有丰富的数据类型,除了基本的整型.浮点型.布尔型.字符串.byte/rune 之外, 还有数组.切片.函数.map.通道(channel).结构体等. Go语言的基本 ...
- AttributeError: module 'numpy' has no attribute 'num'
AttributeError: module 'numpy' has no attribute 'num' 写在前面 总的来说,先看看自己用的计算方式是不是写对了先,多个一起使用的话记得都看看 通过想 ...
- PHPMailer 远程命令执行漏洞 Writeup
漏洞概述 1.漏洞简介 PHPMailer 小于5.2.18的版本存在远程代码执行漏洞.成功利用该漏洞后,攻击者可以远程任意代码执行.许多知名的 CMS 例如 Wordpress 等都是使用这个组件来 ...
- Java中Lambda表达式基础及使用详解
概述 Lambda 是JDK 8 的重要新特性.它允许把函数作为一个方法的参数(函数作为参数传递进方法中),使用 Lambda 表达式可以使代码变的更加简洁紧凑,使Java代码更加优雅. 标准格式 三 ...
- @Profile-根据不同环境注入bean
介绍 @Profile元注解是在不同的生产环境中,@Bean创建的SpringBean根据spring.profiles.active指定的环境不同创建不同环境的bean对象 一.@Profile元注 ...
- COM组件的使用方法
https://prismlibrary.com/docs/wpf/converting-from-7.html Requirement: 1.创建myCom.dll,该COM只有一个组件,两个接口I ...
- DataTemplateSelector介绍
DataTemplateSelector可以帮助我们实现动态选择数据绑定的模版,如通过ListView+DataTemplateSelector实现微信朋友圈或聊天列表效果. Github已有聊天效果 ...
- 不同的 count 用法
不同的 count 用法效率:在 select count(?) from t 这样的查询语句里面, count(*).count(主键 id).count(字段) 和 count(1) 等不同用法的 ...