开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第19天，点击查看活动详情

前言

JS中函数是最重要的部分，说到函数就得说到作用域，理解作用域能够加深我们对函数的理解，平时碰到一些相关bug我们就能快速搞定。

定义

在js中作用域我们可以理解为变量起到生效的范围，出了这个范围，变量就不能用啦。所以作用域是相对于变量而言的，作用域的种类有三种：

• 全局作用域：函数外范围，我们用var声明的变量就是全局变量拥有全局作用域，也就是在script标签内函数外的范围就是全局作用域。
• 局部作用域：函数内范围，在函数内的变量都是局部变量，也就是说变量只能在函数内使用，如果在函数外使用是不允许的。
• 块级作用域：花括号内范围，在js中每个花括号都称作一个块，很明显块级变量只能在块中使用。es6中用let跟const声明的变量就是块级变量。

   //script标签内就是全局作用域
     var a =1//全局变量
     function ex(){
      //局部作用域
      var b = 2//局部变量
      if(b>2){
       //块级作用域
        const c = 3//块级变量
      }
     }
     console.log(b)

上面代码中b是局部变量，在全局作用域使用会报错：

    Uncaught ReferenceError: b is not defined

同理如果在花括号外使用也会报错：

   ex.html:45 Uncaught ReferenceError: c is not defined

作用域链

在js中函数可以套着函数，也就是局部作用域会套着局部作用域，在js执行代码时，在局部作用域内碰到一个变量，会现在本身函数内寻找该变量是否被声明，如果没有会去再上一级去找，最终找到全局作用就，如果全局作用域也没有那就会报错。这就是作用域链，总结起来就是四个字就近原则。

    var a =1//全局变量
     function ex(){
      console.log(a)//1 根据作用域链打印出来1
      }
      ex()

变量提升

我们需要明白变量提升，简单来说变量的使用可以在变量声明前，js执行会把变量声明的代码放到最前面。

   var a =1 
     b = 2
     console.log(a+b)//3
     var b

块级变量不能被变量提升，变量不能在let、const前面使用。

     b = 2
     let b
    //  报错 Uncaught ReferenceError: Cannot access 'b' before initialization

总结

作用域有三种，变量只能在对应的作用域中使用，作用域链遵循就近原则，块级变量不能被变量提升。开发过程中碰到报错某个变量未定义，可以检查下是否超出了作用域使用。