js - 变量声明和函数声明（var）

转载

wx60d4764eb475e 2022-02-17 11:55:46

一、问题

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

二、解决

1. 变量声明提升

var a = 10;

等于

// 预编译
    var a; // 声明会被提到当前作用域的顶端
    // var的作用域只有两种，全局作用域和函数作用域
    ...
    // 执行阶段
    a = 10; // 赋值语句位置不变

2. 函数声明提升

function f() {
        console.log('function');
    }

等于

// 预编译
    var f; 
    f = function () {
        console.log('function');
    };
    ...

3. 变量提升和函数声明提升冲突

console.log(a); // f a(){console.log('function');}
    var a = 10;
    function a() {
        console.log('function');
    }
    console.log(a); // 10

等于

// 函数声明优先

var a; // 函数a
    a = function(){
        console.log('function');
    }

    var a; // 变量a, var是可以重复声明的,且不影响已经赋的值

    console.log(a); // f a(){console.log('function');}

    a = 10; 

    console.log(a); // 10

4. 函数声明和函数表达式冲突（跟3一样）

// 函数声明
    function f(){
        console.log('function');
    }

    // 函数表达式(变量式声明)
    // 函数表达式定义的函数必须先声明后调用，不然报错a is not define
    var f = function(){
        console.log('var');
    }

三、实际面试题

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