Introduction to JS variables and their scope knowledge points

1. Variables and their scope: Variables are divided into "global variables" and "local variables". "Global variables" are declared outside the function and can be used by all functions, while "local variables" are declared inside the function body and can only be used in Used within the function body in which the variable is defined.
(Note: There is no var keyword when declaring variables, but directly assigned variables are global variables)

<script type="text/javascript">
  function main() {　　
    n = 10;//这里的n为全局变量，可以被外部直接使用
  }
  main();
  alert(n);
</script>

2. In the function body, local variables have higher priority than global variables.

<script type="text/javascript">
  //网上看到的我认为很有代表性的一个例子，在函数体外部和内部都申明了相同名字的变量，变量的作用域问题，例子如下：
  var n = 1;
  function test() {
    alert(n); //这里的a并不是全局变量，原因是函数体第四行申明了一个相同重名的局部变
         //量a，如果把第四行a的申明注释掉，那么这里的a显示1，为全局变量。所以得
         //出结论：全局变量a被局部变量a覆盖了。
         //说明了JS函数在test()在执行前，函数体内的变量a都指向了局部变量，但本
         //行输出的a在执行过程中还没有被赋值，所以显示undefined。
    n = 2;
    alert(n);
    var n; //本行申明局部变量a
    alert(n);
  }
    test();
    alert(n);
</script>

According to my understanding, the final output answer of the above example should be: 1 2 2 1; but the correct answer is: undefined 2 2 1; The reason is that the same name is declared both outside and inside the function body variables, local variables override global variables.
3. How to read the local variables inside the function body from the outside?
Generally speaking, only external global variables can be directly obtained from inside the function body, but local variables inside the function body cannot be obtained from the outside. However, this can be achieved by defining another function inside the function body to return local variables, and then calling the function from the outside.

<script type="text/javascript">
  function f1() {　　　　
    var n = 10;　　　　
    function f2() {//在f1()内部再定义f2()，通过f2()访问f1()中的局部变量　　　　　　
      alert(n);　　　　
    }　　　　
    return f2;//返回f1()局部变量n
  }　　
  var result = f1();　//在外部调用f1()函数，就能获取局部变量n的值
  result(); // 10，即为n的值
</script>

The above is the detailed content of Introduction to JS variables and their scope knowledge points. For more information, please follow other related articles on the PHP Chinese website!