JavaScript基础--变量作用域和预解析

作用域

• 在JavaScript中{}外面的作用域, 我们称之为全局作用域
• 在JavaScript中函数后面{}中的的作用域, 我们称之为"局部作用域"
• 在ES6中只要{}没有和函数结合在一起, 那么应该"块级作用域"
• 块级作用域和局部作用域区别
  • 在块级作用域中通过var定义的变量是全局变量
  • 在局部作用域中通过var定义的变量是局部变量
  • 无论是在块级作用域还是在局部作用域, 省略变量前面的let或者var就会变成一个全局变量
• 在JavaScript中定义变量有两种方式
  • ES6之前: var 变量名称;
  • ES6开始: let 变量名称;
• 区别
  • 通过var定义变量,可以重复定义同名的变量,并且后定义的会覆盖先定义的
  • 如果通过let定义变量, "相同作用域内"不可以重复定义同名的变量
  • 通过var定义变量, 可以先使用后定义(预解析)
  • 通过let定义变量, 不可以先使用再定义(不会预解析)
  • 无论是var还是let定义在{}外面都是全局变量
  • 将var定义的变量放到一个单独的{}里面, 还是一个全局变量
  • 将let定义的变量放到一个单独的{}里面, 是一个局部变量

作用域链

• JavaScript代码中至少有一个作用域, 即全局作用域。
• 凡是代码中有函数，那么这个函数就构成另一个作用域。
• 如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域。
• 将这样的所有的作用域列出来，可以形成的结构就称之为作用域链。

<script>
    var num = 123; // 0级作用域链
    function test() { // 0级作用域链
        var num = 666; // 1级作用域链
        console.log(num);
        function demo() { // 2级作用域链
            var num = 777;
            console.log(num);
        }
        demo();
    }
    test();
    console.log(num);
</script>

预解析

• JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。
• JavaScript解析器执行JavaScript代码的时候，分为两个过程
  • 预解析过程
  • 代码执行过程
• 预解析过程：
  • 把变量的声明提升到当前作用域的最前面，只会提升声明，不会提升赋值。
  • 把函数的声明提升到当前作用域的最前面，只会提升声明，不会提升调用。
  • 先提升var，在提升function。
• 注意点:
  • 变量和函数同名时, 函数的优先级高