第四章:提升
笔记:
我们习惯将 var a = 2
;看作一个声明,而实际上JavaScript
引擎并不这么认为。它将var a
和 a = 2
当作两个单独的声明,第一个阶段是编译阶段的任务,而第二个则是执行阶段的任务。
这意味着无论作用域中的声明出现在什么地方,都将在代码本身被执行前首先进行处理。可以将这个过程形象地想象成所有的声明(变量和函数,函数优先于变量),都会被“移动”到各自作用域的顶端,这个过程被称为提升。
这里有个误区要记录一下,函数声明会存在提升,但是函数表达式不存在提升,先来看一下下面的代码:
bar() //ReferenceError: bar is not defined
var foo = function bar(){
console.log(666)
}
它的输出结果是 ReferenceError: bar is not defined,刚开始我一头雾水,觉得引擎应该编译成下面的执行顺序:
function bar(){
console.log(666)
}
var foo
bar()
foo = bar
后来,查了资料才知道,原来编译成真实的执行顺序是这样的:
var foo
bar()
foo = function bar(){
console.log(666)
}
上述代码相当于声明了一个变量foo,然后把函数赋值给变量foo,而变量提升在最开始也说过是将变量的声明提升到顶部,赋值代码留在原地,所以函数表达式不会被提升。function bar 是函数表达式而非函数声明,写在这里,加深印象。
还有一种情况:
console.log(foo); // [Function: foo]
var foo = 10;
function foo () {
console.log(666)
}
上述代码等价于:
function foo () {
console.log(666)
}
var foo;
console.log(foo);
foo = 10;
同名函数和变量为什么没有被覆盖呢?
这是因为对于同名的变量声明,Javascript采用的是忽略原则,后声明的会被忽略。对于同名的函数声明,Javascript采用的是覆盖原则,先声明的会被覆盖。对于同名的函数声明和变量声明,采用的是忽略原则,为了确保函数能够被引用到,在提升时函数声明会提升到变量声明之前,变量声明会被忽略,但是变量赋值以后会被覆盖。总结成一句话就是,两个同名变量会忽略后面,两个同名函数会覆盖前面,同名函数和变量会忽略变量(提升原则,函数先声明)。
总结