js中的变量提升例子

299 阅读1分钟

1、常见的变量提升

console.log(a);
var a=10;
console.log(a);

变量提升后的执行顺序

var a;
console.log(a); //undefined
a=10;
console.log(a); //10

2、if语句中的var

例1:

var a=5;
if(a==5){
  console.log(a)
  var a=3;
  console.log(a)
};
console.log(a);

变量提升后的执行顺序

var a;
a=5;
if(a==5){
  console.log(a) //5
  a=3; 
  console.log(a) //3
};
console.log(a); //3

var a

例2:

if(!(a in window)){
    var a=1;
}
console.log(a);

变量提升后的执行顺序

var a;
if(!(a in window)){
    a=1;
}
alert(a) //undefined

3、function的提升

例1:

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

变量提升后的执行顺序

function a(){
  console.log(456);
}
var a;
a(); //456
a(); //456

例2:

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

变量提升后的执行顺序

function a(){
  console.log(456);
}
var a;
a=10;
a(); //Uncaught TypeError: a is not a function

引用错误a不是一个函数,这个时候定义了一个a变量,会把前面同名的函数给覆盖掉,js是弱数据类型,这个时候a就变成了一个number类型,所以报a不是一个函数。

3、function和var一起使用

var b=10;
function a(){
  console.log(b);
  var b=8;
  console.log(b);
}
a();
console.log(b);

变量提升后

function a(){
   var b;
   console.log(b); //undefind
   b=8; 
   console.log(b); //8
}
var b;
b=10;
a(); 
console.log(b); //10

函数形成的局部作用域,内部声明的变量不能被外部使用。

思考题

var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){
        return scope;
    }
    return f();
}
checkscope();

var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){
        return scope;
    }
    return f;
}
checkscope()();

这两个代码的执行结果?