变量提升和函数提升

变量提升
ES6之前我们一般使用var来声明变量,提升简单来说就是把我们所写的类似于var a = 123;这样的代码,声明提升到它所在作用域的顶端去执行,到我们代码所在的位置来赋值。

function test () {
    console.log(a);  //undefined
    var a = 123; 
};
test();

上述代码a的结果是undefined,它的实际执行顺序如下:

function test () {
    var a;
    console.log(a);
    a = 123;
}
test();

再看一个:

a = 1;
var a;
console.log(a); //1

第一眼看到的时候是不是会认为undefined, 记住声明会提升到作用域顶端。

下面来看一道经典面试题:

console.log(v1);
var v1 = 100;
function foo() {
    console.log(v1);
    var v1 = 200;
    console.log(v1);
}
foo();
console.log(v1);

输出的结果:

//undefined
//undefined
//200
//100

函数提升
javascript中不仅仅是变量声明有提升的现象,函数的声明也是一样;具名函数的声明有两种方式:

1. 函数声明式    2. 函数字面量式
//函数声明式
function bar () {}
//函数字面量式 
var foo = function () {}

函数字面量式的声明合变量提升的结果是一样的,函数只是一个具体的值;

但是函数声明式的提升现象和变量提升略有不同

console.log(bar);
function bar () {
  console.log(1);
}
//打印结果:ƒ bar () {
//  console.log(1);
//}
执行顺序相当于:

function bar () {
  console.log(1);
}
console.log(bar);

函数提升是整个代码块提升到它所在的作用域的最开始执行

思考下面的问题(看明白函数声明式提升下面的问题大概可以理解为什么输出1而不是2了吧):

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

这就是函数优先规则。

下面这段代码,在低版本的浏览器中,函数提升不会被条件判断所控制,输出2;但是在高版本的浏览器中会报错,所以应该尽可能避免在块内部声明函数

foo(); //低版本:2  //高版本: Uncaught TypeError: foo is not a function
 
var a = true;
 
if(a){
    function foo () { console.log(1); }
}else{
    function foo () { console.log(2); }
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值