对于 JS 中 变量提升和函数声明提升的一个概括 :

这篇文章对于 JS 中 变量提升 和 函数声明提升 做一个简单的概括 :  

参考链接 ： https://blog.csdn.net/qq_40856225/article/details/82916382

 

---

• 变量的 定义 :

在 ES6 之前可以使用 var 关键字来定义一个变量；如果变量未初始化，则变量的值为 undefined；

• 变量的 作用域 ：

1. 根据变量作用域可以分为全局变量和局部变量；全局变量的作用域为全部作用域；局部变量作用域为函数内；
2. 根据变量作用域可以分为全局变量和局部变量；全局变量的作用域为全部作用域；局部变量作用域为函数内；
3. 在 JS 变量声明中，若不使用 var 关键字，则声明的变量为全局变量。因此可以用这种方法定义全局变量，但是不推荐这种做法，因为在局部作用域中定义的全局变量很难维护。

• 变量的 提升 :

var name="bob";
function getName1(){
    console.log(name)//当函数运行的时候函数会向上查找name的值，当找到就返回，找不到就继续往上查找
}
function getName2(){
    //在该函数中，由于变量提升，在函数内部name被声明为局部变量，但没有初始化
    console.log(name);//undefined
    var name="jack";
    console.log(name)//jack
}
 
//理解第一个name输出undefined;上面getName等价于下面函数========================================
function getName2(){
    var name;              //在这里name的变量提升了，未初始化的值为undefined
    console.log(name);     //undefined
    name="jack";
    console.log(name)      //jack
}

• 变量 初始化 不会提升 ：

var x = 5; // 初始化 x
console.log(x);           //输出5
console.log(y);           //输出undefine
var y = 7; // 初始化 y

• 函数声明 的方式创建函数  :

//通常情况下，我们要先定义函数，再调用函数，才可以执行 
//函数声明方式定义函数 
function getName(){
    console.log("bob")
}
getName()           //输出  bob
 
----------------------------------------------------------------------------

//这种情况先调用后声明也可以使函数执行
//因为在函数声明有一个重要的特征就是函数声明提升
getName()           //输出  bob
function getName(){
    console.log("bob")
}                 
 

• 函数表达式 的方式创建函数  :

var getName=function(){
    console.log("bob")
}
getName()          //输出    bob
 
--------------------------------------------------------------------------
 
//说明函数表达式方式定义的函数，没有函数声明提升的特性
getName()          //报错   Uncaught ReferenceError: getName is not defined(…)
var getName=function(){
    console.log("bob")
}               

• 同时具有 函数声明提升 和 变量提升 的例子 ：

function getName (){
    console.log("jack");          //函数声明提升到顶部
} 
var getName;                     //变量声明提升
getName = function(){
    console.log("bob");
}                                //此时函数的值将上面的值覆盖 
getName();                       //输出bob

函数声明  function getName(){} 的声明会被提前到顶部。而函数表达式  var getName = function(){} 则表现出变量声明提升。因此在这种情况下，getName 也是一个变量，因此这个变量的声明也将提升到顶部，而变量的赋值依然保留在原来的位置。需要注意的是，函数优先，虽然函数声明和变量声明都会被提升，但是函数会首先被提升，然后才是变量。