javascript中变量和函数声明的提升

1.概念

• 变量声明提升

变量声明提升是只当栈内存作用域形成时，js代码执行之前，浏览器会先把带有var和function关键字的变量提前声明，这种预先处理的机制就叫做变量提升机制也叫预定义。

• 函数声明提升

函数声明提升与变量声明提升的本质上基本一致，但函数声明提升，也会在堆内存开辟一个空间，他的值是函数体的字符串。所以在预编译阶段，将函数提升到顶部声明，并将默认值赋值为一个引用，引用的值是堆内存的函数体字符串。

2.原理

变量声明提升原理：js引擎会在代码执行之前进行一次预编译，将带有var关键字的变量提升到最顶部，默认值为undefined。然后再按顺序执行代码。

3.总结

1.在JavaScript中变量和函数的声明会提升到最顶部执行。

2.函数的提升高于变量的提升。

ex:

1.//先声明函数后声明变量，证明上边的例子不是function覆盖了变量
function a() {}
var a; 
alert(typeof a);  //显示的是"function",而不是"undefined"，即function的优先级高于var。

2.//声明了变量的同时赋值
function a() {}
var a = 1;
alert(typeof a);  //number,此时不是function了。
//说明："var a=1"相当于"var a;a=1",即先声明，后赋值，"a=1"相当于把a重新赋值了，自然就是number!

3.函数内部如果用var声明了相同名称的外部变量，函数将不再向上寻找。

ex：

var value = 'hello';
function  show() {
    alert(value);
    if (!value) {
        var value = 'function';
    }
    alert(value);
}
show() //此处调用函数依次弹出 "undefined", "function"

//上例相当于
var value = 'hello';
function  show() {
　　var value;  //注意这行
    alert(value);
    if (!value) {
        value = 'function';  //这行去掉var
    }
    alert(value);
}
show()
//1.如果上列中show内部定义value未用var,则会用到外部的变量，弹出"hello", "hello"。 
//2.如果函数内部未定义value,也能获取到外部的value值。

4.匿名函数不会提升。

ex:

getName()
var getName = function () {
    alert('closule')
}
function getName() {
    alert('function')
}
getName()

//上边的代码相当于
function getName() {  //函数向上提升
    alert('function')
}
getName()
var getName = function () {
    alert('closule')
}
getName()

//代码执行分别弹出 "function", "closule"

5.不同<script>块中的函数互不影响。

ex:

<script>
    getName()
    var getName = function () {
        alert('closule')
    }
<script>
<script>
    function getName() {
        alert('function')
    }
<script>

//代码执行报错：TypeError: getName is not a function
//因为第一个<script>块中getName()函数未定义,匿名函数又不会向上提升