1. 变量提升概念
- 在当前上下文中（全局/私有/块级），JS代码自上而下执行之前，浏览器会提前处理一些事情（可以理解为词法解析的一个环节，词法解析一定发生在代码执行之前）
2. 词法解析：
- 词法解析会把当前上下文中所有带var/function关键字的进行提前声明或者定义
- 带var的只提前声明
- 带function的提前声明+定义
创建变量：var a = 10;
1. 声明declare：var a
2. 定义defined：a = 10
复制代码3. var的变量提升
/*
代码执行之前，全局上下文中的变量提升
var a; 默认值是undefined
*/
console.log(a); // a变量提升，未定义，undefined
var a = 12; // 定义赋值 a = 12
a = 13; // 全局变量 a = 13
console.log(a); // 13
复制代码4. function声明函数和函数表达式声明函数
/*
全局上下文中的变量提升
func = 函数，函数在这个阶段赋值就做了
*/
func();
function func() {
var a = 12;
console.log('OK')
}
复制代码- 真实项目中期望用函数表达式方式创建函数，因为这样在变量提升阶段只会声明func，不会赋值，顺序性，不要再声明前执行
func() // func is not a function
var func = function() {
}
复制代码- 函数表达式声明非匿名函数
var func = function AAA() {
// 把原本作为值的函数表达式匿名函数具名化，但是外部不能访问，也就是不会在当前上下文创建这个名字
// 函数执行，在形成的私有上下文中，可以访问
console.log('OK')
//AAA() // 递归死循环
console.log(AAA, typeof AAA) // "function"
}
AAA() // Uncaught ReferenceError: AAA is not defined
func()
复制代码- 匿名函数具名化eg
setTimeout(function func() {
func()
}, 1000)
复制代码5. 例子
/*
EC(G)全局变量提升
*/
console.log(window.a); // undefined
console.log(a); // a is not defined
a = 13;
console.log(a) // 13
console.log(window.a) // 13
// let 定义 不会同时在window创建, var和直接创建都会在windoow中
复制代码/*
EC(G)全局变量提升，let和const 不变量提升
*/
console.log('OK') // OK
console.log(a); // a is not defined
let a = 12;
a = 13;
console.log(a);
复制代码基于
var/function在全局上下文中声明的变量，全局变量，会映射到GO（全局对象），也就是window上一份，作为属性
// 无论条件是否成立，都要进行变量提升
if(!("a" in window)) { // !true -> false
var a = 1;
}
console.log(a); // undefined
复制代码/*
变量提升
扫描代码，fn=>1 不会重新声明，但是要重新赋值
fn=>2
var fn 上面做过了，忽略
fn=>4
fn=>5
window.fn 此时也是5
*/
fn(); // 5 变量提升完结果是5
function fn() {console.log(1)} // 不再处理，变量提升阶段已经做过
fn(); // 5
function fn() {console.log(2)}
fn(); // 5
var fn = function() {console.log(3)} // 变量提升阶段，没做个这个赋值，现在赋值
fn(); // 3
function fn() {console.log(4)} // 不再处理
fn(); // 3
function fn() {console.log(5)}
复制代码var foo = 1;
function bar() {
if(!foo) {
var foo = 10;
}
console.log(foo)
}
bar(); // 10
console.log(foo) // 1
复制代码