思维导图
回顾作用域
在编译的代码生成阶段,编译器会创建在对应作用域创建变量,将2者关联起来。
先声明后赋值
讲到var
声明的变量会进行“变量提升”,大家可能都觉得不稀奇,但是我这里还是写出来。
a = 2; var a; console.log(a); // 2 复制代码
console.log( a ); // undefined var a = 2; 复制代码
var
声明的变量会进行“变量提升”
上面的代码会变成这样
var a; a = 2; console.log(a); // 2 复制代码
var a; // 声明未赋值默认值是undefined console.log( a ); // undefined a = 2; 复制代码
编译器先“动手”
总结: 变量和函数在内的所有声明都会在任何代码被执行前首先被处理。
var a = 2; console.log( a ); // 2 复制代码
上面代码可以看出
var a; // 编译器声明(先,不管在源代码的哪个位置) a = 2;// 代码执行赋值 console.log( a ); // 2 复制代码
函数提升
总结: 函数声明会被提升,但是函数表达式却不会被提升。
foo(); function foo() { console.log(a); // undefined var a = 2; } 复制代码
上面代码可以写成下面这样
function foo() { var a; console.log(a); // undefined a = 2; } foo(); 复制代码
函数表达式不用提升,函数表达式就是把一个函数赋值给一个变量,既然都是赋值,那么自然不会提升,只有声明才会提升。即使是具名的函数表达式,名称标识符在赋值之前也无法在所在作用域中使用。
foo(); // TypeError 这里foo是默认值undefined(var的原因) bar(); // ReferenceError var foo = function bar() { console.log(a); // undefined var a = 2; } 复制代码
函数优先
函数声明和变量声明都会被提升。但是函数会首先被提升,然后才是变量
foo(); // 1 var foo; function foo() { console.log(1); } foo = function () { console.log(2); }; 复制代码
上面代码foo()
是1不是TypeError。所以函数声明是比变量声明更优先。
foo(); // TypeError: foo is not a function function foo() { console.log(2); }; var foo; // 被忽略 复制代码
函数声明还是可以覆盖
foo(); // 3 function foo() { console.log(1); } var foo = function () { console.log(2); }; function foo() { console.log(3); } 复制代码
总结 声明本身会被提升,而包括函数表达式的赋值在内的赋值操作并不会提升。