JavaScripts之变量作用域提升问题(var、let、const)

变量提升（Hoisting）

var: 使用var在函数或全局内任何地方声明变量相当于在其内部最顶上声明它，这种行为称为Hoisting（提升）

注意：变量赋值的位置不会改变

  function fn() {

     console.log(x) // -> undefined

     var x = 2

  }

  // 等同于：

  function fn() {

    var x // 变量提升到函数最顶部

    console.log(x)

    x = 2 // 赋值的位置不变

  }

let/const: 使用 let/const 定义变量是存在块级作用域({...})的，它同样存在变量提升，但是由于有临时死区的概念，导致变量在未初始化的时候是不能够使用的（所以看上去是没有变量提升的）

  function fn() {

    console.log(x) // 报错 ->  Cannot access 'name' before initialization

    // var -> let 使得 x 存在临时死区，在未初始化之前是无法被使用的

    let x = 2

  }

  // 正确方式

  function fn() {

    let x = 2 // 定义并初始化

    console.log(x) // -> 2

  }

变量的作用域

var：只存在函数作用域和全局作用域

  // 使用 var 在函数外部定义变量，会提升到全局作用域

  var globalA = c

  function fn() {

    if(true) {

      // 会在函数顶部定义 a = undefind, 所以在下方的console.log中能够正常输出

      // 这里其实是 a = 1 赋值的步骤

      var a = 1

    }

    console.log(a) // -> 1

  }

const/let: 局部作用域({ ... })

  console.log(curA) // -> Cannot access 'curA' before initialization

  // 只能在初始化后才能使用 curA

  const curA = 'ccc'

  console.log(curA) // -> 'ccc'

  function fn() {

    if(true) {

      console.log(a) // a is not defined

    }

    let a = 1

  }

巴特西

JavaScripts之变量作用域提升问题(var、let、const)

最新文章

热门文章