js预解析
2018-05-05 本文已影响0人
张鸽
首先来一个简单的代码:
<script>
console.log(a);
var a = 10;
console.log(a);
function a() {
var b = 1;
}
console.log(a);
var a = function() {
var b = 2;
};
console.log(a);
</script>
那么结果是什么呢?
我本来以为是undefined、10、function a() { var b = 1; }、function() { var b = 2; }
但是结果却是这样的:
为什么会这样呢,是因为 js 在正常解析前先进行预解析,那么如何预解析呢?
- var 预解析
js 在正常解析之前,会快速的把 script (或者 funciton )中的 var 声明及声明的名字,提升到代码块(作用域)的最前面。 - function 预解析
js 在正常解析之前,会快速的把 script (或者 funciton )中的 function 及内容提升到代码块(作用域)的最前面,跟在 var 声明之后。
在预解析时,会产生一个仓库,存储声明的变量和函数,如果变量或函数有同名的情况,则覆盖前面的,只留一个。在解析代码时,在这个仓库里找同名的变量或是函数
下面是我对上面例子的预解析过程的理解:
第一步对 var、function 提升:
var a;
var a;
function a() {
var b = 1;
}
console.log(a);
a = 10;
console.log(a);
console.log(a);
a = function() {
var b = 2;
};
console.log(a);
第二步同名覆盖:
function a() {
var b = 1;
}
console.log(a);
a = 10;
console.log(a);
console.log(a);
a = function() {
var b = 2;
};
console.log(a);
预解析后, js 会从上到下一行一行执行,遇到表达式时,如果表达式对变量进行修改,则修改预解析的值。就像上面的yu
总结:感觉自己要巩固基础