JavaScript范围冲突

Question

JavaScript范围冲突

Sig*_*gma 6 html javascript scope variable-declaration hoisting

我试图了解JavaScript的范围.如果我在函数之外声明一个变量,那么它就是GLOBAL.因此,我测试了以下代码以了解执行顺序.在下面的代码中,我期望"demo1"采用全局值"Volvo",因为我在声明函数内部具有相同名称的局部变量之前呈现该文本.但令我惊讶的是,我认为价值是"未定义的".

<!DOCTYPE html>
<html>

<body>
    <p id="demo"></p>
    <p id="demo1"></p>
    <p id="demo2"></p>
    <script>
        var carName = "Volvo";
        myFunction();
        document.getElementById("demo").innerHTML = carName;

        function myFunction() {
            document.getElementById("demo1").innerHTML = carName;
            var carName = "Volvo1";
            document.getElementById("demo2").innerHTML = carName;
        }
    </script>
</body>

</html>

Run Code Online (Sandbox Code Playgroud)

结果:

Volvo

undefined

Volvo1

我进一步修改了如果在函数内部声明另一个Global变量会发生什么,如下所示:

<!DOCTYPE html>
<html>

<body>

    <p id="demo"></p>
    <p id="demo1"></p>
    <p id="demo2"></p>

    <script>
        var carName = "Volvo";
        myFunction();
        document.getElementById("demo").innerHTML = carName;

        function myFunction() {
            document.getElementById("demo1").innerHTML = carName;

            //declaring another global variable
            carName = "Volvo1";
            document.getElementById("demo2").innerHTML = carName;
        }
    </script>
</body>

</html>

Run Code Online (Sandbox Code Playgroud)

结果:

Volvo1

Volvo

Volvo1

这次"demo1"假定在函数外声明的全局变量即"Volvo".

谁可以给我解释一下这个？

Answer 1

cнŝ*_*ŝdk 4

在JavaScript中,这称为变量提升,其定义为:

新JavaScript开发人员JavaScript的一个棘手方面是变量和函数被"提升".

他们可能事先可以获得,而不是在声明之后可用.

这意味着第二VAR声明你的carName变量不包括/消灭的第一个函数内部.

因为如果你声明一个变量与var关键字在全球范围内的代码(代码的开始)和再重新申报与var关键字相同的变量在另一个范围(功能,...)这第二个声明将排除的第一个这个变量值 变成了 undefined.

编辑:

您可以在变量提升部分中看到变量提升的影响以及变量声明和变量分配之间的差异:

如果在函数中定义,则所有变量声明都被提升(提升并声明)到函数的顶部,如果在函数外部,则被提升到全局上下文的顶部.

重要的是要知道只有变量声明被提升到顶部,而不是变量初始化或赋值(当变量被赋值时).

归档时间：	10 年，5 月前
查看次数：	461 次
最近记录：	7 年，11 月前