Shaoli's Blog

js 变量提升和函数提升

我们先来看看这段代码的输出结果。


console.log(a);
var a = 1;
console.log(a);
function a() {
 console.log(2)
}
console.log(a);
function a() {
 console.log(3)
}



答案如下,这是为什么呢??



原理如下

  1. 函数声明会置顶 
  2. 变量声明也会置顶 
  3. 在作用域中,不管是变量还是函数,都会提升到作用域最开始的位置,不同的是,函数的提升后的位置是在变量提升后的位置之后的,也就是函数提升在变量提升上。
  4. 变量和赋值语句一起书写,在js引擎解析时,会将其拆成声明和赋值2部分,声明置顶,赋值保留在原来位置 
  5. 声明过的变量不会重复声明


以上代码等同于

var a;
function a() {
    console.log(2)
}
function a() {
    console.log(3)
}
console.log(a); // a()
a = 1;
console.log(a); //1
console.log(a); //1


或者更仔细的写法

var a;
var a = function() {
    console.log(2)
}
var a = function() {
    console.log(3)
}
console.log(a); // a()
a = 1;
console.log(a); //1
console.log(a); //1



下面还有以下例子

// 代码段1
function foo() {
  var a = 1;
  function a() {}
  console.log(a);
}
foo();

// 代码段2
function foo() {
  var a;
  function a() {}
  console.log(a);
}
foo();


会输出什么呢?



答案是

1function a() {}


相当于

function foo() {
    var a;
    function a() {}
    a = 1;
    console.log(a);
}
foo();

function foo() {
    var a;
    function a() {}
    console.log(a);
}
foo();
    评论列表

  • 暂无评论...快来说说吧!
person
0 / 16
comment
0 / 100