函数中的全局变量不更新

I write this simple program to update value of JS hoisting. But as per my understanding global x need to update, but It is not updating.

我编写这个简单的程序来更新JS吊装的值。但根据我的理解，global x需要更新，但它没有更新。

x = 5;
var w = function(){
    x = 7
    var x;
    console.log(x);
    x = 10;
    console.log(x);
};
w();
console.log(x);

Output:

输出:

Could anyone explain in more details why it did not update global x ?

有人能详细解释一下为什么它没有更新global x吗?

Javascript work on reference of values so when I write x = 7, it should be update the global x. But it din't! So I just want to why x =7 doesn't work ?

Javascript工作于值的引用，所以当我写x = 7时，它应该是更新全局x，但它不是!我想知道为什么x =7不成立?

Thanks!

谢谢!

3 个解决方案

#1

Because you redeclared x in your function's local scope. That's the one you assigned 10 to, instead of the global one.

因为你在函数的局部作用域中重新声明了x。这是你分配给10的，而不是全局的。

Ditch the var x; and it will work.

沟var x;它会工作。

x = 5;
var w = function(){
    x = 7
    // var x;
    console.log(x);
    x = 10;
    console.log(x);
};
w();
console.log(x);

That being said, what's probably baffling you is hoisting

话虽如此，让你感到困惑的是，你正在吊起的东西

Hoisting is JavaScript's default behavior of moving all declarations to the top of the current scope (to the top of the current script or the current function).

提升是JavaScript将所有声明移动到当前范围的顶部(移动到当前脚本或当前函数的顶部)的默认行为。

x = 5;
var w = function(){
    x = 7
    var x; // this is moved to the top of the local scope
    console.log(x);
    x = 10;
    console.log(x);
};
w();
console.log(x);

#2

The moment you declared a variable inside your function, it masked the global variable due to the way scoping rules work from inner to outer. So, function level var x variable is found first and not the global one that you expected.

当您在函数中声明一个变量时，由于范围规则从内部到外部的工作方式，它掩盖了全局变量。函数级var x变量首先被找到，而不是你所期望的全局变量。

JS converted your function from :

JS转换了你的功能:

function(){
    x = 7
    var x;
    console.log(x);
    x = 10;
    console.log(x);
}

to this:

function(){
    var x;
    x = 7
    //var x;
    console.log(x);
    x = 10;
    console.log(x);
}

To your question about updating x = 7 and then declaring var x, let me explain it a bit more. Javascript code is not just executed, there is a compilation phase too. In this phase var declarations are looked inside the function(apart from so many other things that happen but I am just sticking to the question at hand). If found, they are moved at the top of the function. This is called hoisting. At this time you can think that your code has been modified by JS(order of var declaration and assignment doesn't matter now). If you just think of code being interpreted then order matters but as I said, due to compilation phase the hoisting occurs and not thinking in these terms causes the confusion you have. Once you look at it from compilation, hoisting angle, things look clearer.

对于您关于更新x = 7然后声明var x的问题，让我再解释一下。Javascript代码不仅被执行，还有一个编译阶段。在这个阶段，var声明被观察到函数的内部(除了发生的许多其他事情之外，但是我只是坚持手头的问题)。如果找到，它们将在函数的顶部移动。这就是所谓的提升。此时，您可以认为您的代码已经被JS修改过(var声明和赋值的顺序现在不重要)。如果你认为代码是被解释的，那么顺序很重要，但是正如我所说的，由于编译阶段的原因，提升发生了，没有按照这些术语思考会导致混乱。一旦你从编译、提升角度来看它，事情就会变得更清晰。

Hope it helps! For further study, please read/listen Kyle Simpson who is authority on javascript.

希望它可以帮助!为了进一步学习，请阅读/听Kyle Simpson对javascript的权威。

#3

Always remember , local variable has highest precedence over any other and also please use proper naming conventions for the global and local variables thus preventing you from causing this kind of errors. They are very hard to be detected in huge project.

请记住，局部变量的优先级最高，并且请对全局变量和局部变量使用适当的命名约定，从而防止您产生此类错误。在大型项目中很难发现它们。

#1