js全局预处理与执行过程
程序员文章站
2022-04-04 20:49:25
...
js全局预处理与执行过程
- 预处理阶段:
- js在预处理阶段只做两件事:
- 查找用var 声明的变量和以声明方式声明的函数,即这种:
var b = 1;
function a() {
//state
}
-
将查找到的加在window 或 Global Object 的词法作用域中并进行预赋值,像这样:
window:
{
b:undefined;
a:保存对a函数的引用
}
- 所以我们很容易看到这样的效果:(在变量被声明之前被调用却不会报错,所谓变量提升)
console.log(a)
console.log(b)
console.log(c)
console.log(d)
var b = 1;
function a() {
console.log('aa')
}
c = 2;
d = function(){
//state
}
var e = function(){
//state
}
// undefined
// undefined
// 将会报错 c is not defined
// 报错
// undefined
// 不过这种情况将在 js的严格模式下都会报错(此处不探究)
- 代码执行阶段:
- 代码执行原则:从上向下执行。
- 当遇到存在于window词法作用域中的变量时进行再赋值;
- 当遇到不存在于window词法作用域中的变量时,js将一次性执行声明(变量成为词法作用域成员)并执行赋值操作。
- 特殊情况:
- 函数主大,直接看代码:
console.log(a)
var a = 1;
function a() {
console.log('aa')
}
// 输出对函数a的引用
- 如果将此处解释位后声明的覆盖了前面声明的话,还解释的通。但如果像下面这样:
console.log(a)
function a() {
console.log('aa')
}
var a = 1;
// 输出对函数a的引用
-
他仍然输出对函数a的引用,这就是我们说的函数主大,当命名冲突时,函数覆盖变量,而变量不能覆盖函数。
- 函数中未用var声明的变量将直接进入window的词法作用域。比如这样:
function a1() {
function a2() {
a = '我就是'
}
a2()
}
a1()
console.log(a)
// 输出 '我就是'
上一篇: JS数组的常用方法总结
下一篇: Jquery on事件执行两次