JS的变量提升和函数声明提升顺序以及覆盖规则

//update:好吧我已经搞清楚了,会在时间限制后自己回答……

《你不知道的Javascript》里面说是函数声明提升优先

代码1

foo(); //输出1
var foo = function(){
  console.log(2)
}
function foo(){
  console.log(1)
}

会被解释为这样?为什么undefined的变量foo不会导致foo()抛错?书上说是因为重复声明所以被忽略,有没有相关资料参考下?

function foo(){
  console.log(1)
}
var foo;
foo(); //输出1
foo = function(){console.log(2)}

代码2

var foo = function(){
  console.log(2)
}
function foo(){
  console.log(1)
}
foo();//输出2

会被解释为这样?

function foo(){
  console.log(1)
}
var foo;
foo = function(){console.log(2)}
foo();//输出2

规则是:
对于同名的变量声明,Javascript采用的是忽略原则,后声明的会被忽略,变量声明和赋值操作可以写在一起,但是只有声明会被提升,提升后变量的值默认为undefined,结果是在赋值操作执行前变量的值必为undefined

对于同名的函数声明,Javascript采用的是覆盖原则,先声明的会被覆盖,因为函数在声明时会指定函数的内容,所以同一作用域下一系列同名函数声明的最终结果是调用时函数的内容和最后一次函数声明相同

对于同名的函数声明和变量声明,采用的是忽略原则,由于在提升时函数声明会提升到变量声明之前,变量声明一定会被忽略,所以结果是函数声明有效

同名函数声明

function foo(){console.log(1)}
function foo(){console.log(2)}  //覆盖第一行
foo() //2

同名变量

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

会被解析为

var foo
var foo //被忽略
foo = function(){console.log(1)}
foo = function(){console.log(2)}

同名变量和函数声明

function foo(){
  console.log(1)
}
var foo; //被忽略
foo(); //1

 

理解清楚,申明和赋值的顺序,2个维度的问题。
首先把所有的申明提前,并且函数申明在变量申明之前
再赋值操作。
回到问题

foo() // 这里先把所有的申明提前,函数申明的优先级更高,所以do something
var foo = function(){
    // do something else
}
function foo(){
    // do something
}

还有一个demo

function foo(){
  // do something
}
var foo;
foo = function(){
    // do something else
}
foo();//foo最开始申明是do something,但是调用之前又做了赋值操作,所以do something else

补充一个demo:
var a=undefined; function () {console.log(1)}; a();
//=>Uncaught TypeError: a is not a function

原因:变量声明分为两步。var a=undefined;会被编辑器解析为var a; a=undefined;两步来执行,第一步定义声明var a; 在编译阶段,第二步赋值声明 a=undefined;在执行阶段。所以此处执行过程是:function a(){};
var a;
a=undefined;
a()

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值