一直以来对变量提升都是比较模糊的,今天特地看了一下这个知识点,总结一下。
1、举个最简单的例子来说一下什么是变量提升吧。
- function foo() {
- console.log(x); // undefined
- var x = 12;
- console.log(x) // 12
- }
- foo();
由于变量声明提升,其实上述代码相当于
- function foo() {
- var x;
- console.log(x); // undefined
- x = 12;
- console.log(x) // 12
- }
- foo();
可以看出,变量提升其实是变量声明的提升,变量值并没有提升。
现在将上述代码变一下。
- var x = 123;
- function foo(){
- console.log(x); // undefined
- var x = 12;
- console.log(x) // 12
- }
- foo();
- console.log(x) // 123 这里之所以结果为123,是因为在函数内声明的变量x虽然与函数外同名,但由于是在函数内且用关键字var来声明的,所以函数内的x只是一个局部变量,函数外无法访问到
2、在函数内变量声明前使用 return 关键字。
- function too() {
- console.log(y + "*"); // undefined*
- y = 10;
- console.log(y + "**"); // 10**
- return; // 函数内return后的语句不会执行
- console.log(y + "***");
- var y = 2;
- console.log(y + "****")
- }
- too();
因为变量声明提升,且函数内使用了 return 关键字,故函数内 return 后面的语句并不会执行。所以上述语句相当于
- function too() {
- var y;
- console.log(y + "*"); // undefined*
- y = 10;
- console.log(y + "**"); // 10**
- }
- too();
3、控制语句内声明变量(如 for 循环或 if 语句中)
(1)、for 语句内声明变量:
- for(var i=0;i<5;i++){}
- console.log(i) // 5
运行后可以看出,for 语句内声明的变量,语句外仍然可以使用。
(2)、if 语句内声明变量:
- if(100){
- var x = 30;
- }
- console.log(x) // 30
运行后,可以看出,在 if 语句内声明的变量在 if 语句外仍然可以使用。
(3)、在 if 语句内声明一个与外部同名的变量:
- var x = 123;
- if(100){
- var x = 30;
- }
- console.log(x) // 30
运行后,可以看出 if 语句内的变量会覆盖 if 语句外声明的变量。
来源: http://www.bubuko.com/infodetail-2427823.html