JavaScript 中的作用域、预解析与变量声明提升

• 作用域

  • 全局作用域在函数外部的区域,都可以称之为全局作用域
  • 局部作用域在函数内部的区域,都可以称之为局部作用域
  • 块级作用域es6中新增了块级作用域,把{}都可以视为块级作用域

• 预解析

  • 该机制是javaScript中存在的一种机制,会把函数声明,和使用Var声明的变量,进行提升

• 变量声明提升

  • 只要使用了var声明,就会存在变量声明提升的问题

  console.log(num)// undefined
    var num = 20;
    // 解析为:
    var num;
    console.log(num) // 声明了变量,但是未赋值,undefined
    num = 20
     *********************************分割线*******************************************
        // 函数表达式中,使用了var关键字,会报错
    	fn() // TypeError: fn is not a function
        var fn = function(){
          console.log('啊~我提升了')
        }
        // 解析为
        var fn
        fn()
        fn =function (){
          console.log('啊~我提升了')
        }
  

  • 函数声明也会被预解析机制影响,导致函数声明提升函数虽然提前调用,但是不会报错,印证了函数声明存在预解析

       fn() // 输出: 预解析中的函数声明
        function fn() {
          return console.log('预解析中的函数声明')
        }
        // 解析为:
        function fn() {
          return console.log('预解析中的函数声明')
        }
        fn()
  

  • 函数名重复的情况下如果两个名称相同,会保留后者

  // 两个函数名称相同,那么会输出最后函数的结果
    fn()
  function fn() {
          return console.log('我是fn函数A')
  }
    fn()
   function fn() {
          return console.log('我是fn函数B')
   }
  // 输出: 两个: 我是fn函数B
  
  //解析为:
    function fn() {
          return console.log('我是fn函数A')
        }
    function fn() {
          return console.log('我是fn函数B')
    }
   fn()
   fn()
  

  • 函数名和变量名重复:只会对函数进行提升,变量忽略,并且不会发生调用

   console.log(fnc) // 输出函数体: fucntion fn () { console.log('我是函数') }
        function fnc() {
          return console.log('我是函数')
        }
        var fnc = '我是一个字符串'
        // 解析为:
        function fnc(){}
        console.log(fnc)
        fnc = '我是一个字符串'
        //总结: 只会对函数进行提升,变量会被忽略,并且不会发生调用