关于JS预编译小结
2022-01-07 本文已影响0人
flyinskybiu
关于JS预编译过程理解。
看一到常见面试题,请问下面输出的值是多少?
function fn(a, c) {
console.log(a)
var a = 123
console.log(a)
console.log(c)
function a() { }
if (false) {
var d = 678
}
console.log(d)
console.log(b)
var b = function () { }
console.log(b)
function c() { }
console.log(c)
}
fn(1,2)
正确答案:
function fn(a, c) {
console.log(a) //function a() { }
var a = 123
console.log(a) //123
console.log(c) //function c() { }
function a() { }
if (false) {
var d = 678
}
console.log(d) // undefined
console.log(b) // undefined
var b = function () { }
console.log(b) //function () { }
function c() { }
console.log(c) // function c() { }
}
fn(1,2)
不知道各位有没有答对呢?接下来看一下JS在预编译阶段都做了些啥,你就能理解为啥是这些输出了!
1. js会创建ao对象(供js引擎自己去访问的)
2. 找到形参和变量的申明并且会赋值undefined
3. 实参和形参相统一
4. 找函数声明 会覆盖变量的声明
接下来我们看一下这个函数作用域生成的ao对象的过程
//js创建ao对象
ao {
}
//找到形参和变量的申明
ao {
a :undefined
c : undefined
d : undefined
b : undefined
}
//实参和形参相统一
ao {
a :1
c : 2
d : undefined
b : undefined
}
//找函数声明 会覆盖变量的声明
ao {
a :function a() { }
c : function c() { }
d : undefined
b : undefined
}