变量提升
JavaScript引擎工作的方式是,先解析代码,获取所有被声明的变量,然后一行一行地运行。这造成的结果,就是所有的变亮的声明语句都会被提升到代码头部,这就叫做变量提升(hoisting)。
举几个栗子:
console.log(a);
var a = 1;
上面代码使用console.log(a)
的方法在控制台显示变量a的值,但是这是变量a的值并没有声明和赋值。学过C语言的同学会说这样子是错误的,但是在JavaScript中并不是错误的。实际上运行的过程是这样子的:
var a;
console.log(a);
a =1;
最后显示的结果为undefined
,表示变量a
已经声明,但是并没有赋值。
变量提升只对var
声明的变量有效,如果一个变量不是用var声明的,那么这个变量就不会发生变量提升。
let b;
console.log(b);
上面语句会报错!ReferenceError: b is not defined
说明变量b并没有被声明,这是因为b
不是用var
命令声明的,所以JavaScript引擎不会将其提升。
var x = 5 //初始化x
elem = document.getElemById("demo")
elem.innerHTML = x + " " + y
var y = 7 //初始化y
在上述代码中,y
输出了undefined
, 这是因为变量声明y
提升了,但是初始化y=7
并不会提升,所以y
变量是一个未知的变量。
var x = 5;
var y;
elem = document.getElementById("demo");
elem.innerHTML = x + " " + y ;
y = 7;
上面的代码之前错误代码的正确写法。
因此,我们得养成一个良好的习惯,在头部就声明我们的变量从而避免不必要的错误。
未完待续。。。