JS 作用域和作用域链

2021-04-21 本文已影响0人 lio_zero

作用域

JavaScript 中的作用域是我们可以有效访问变量或函数的区域。作用域规定了如何查找变量，也就是确定当前执行代码对变量的访问权限。

JavaScript 有两种类型的作用域：全局作用域、局部作用域。局部作用域又可以分为：函数作用域、块作用域（ES6）和其他更具体的作用域。

全局作用域

let age= 18

function foo() {
  // 不是嵌套函数
  // 函数内部可以访问函数外部变量
  return age
}

foo() // 18

函数作用域

function text() {
  var age = 18
}

// 函数外部访问不到函数内部变量
console.log(age) // undefined

块作用域

{
  let age = 18
}

// let、const 关键字声明的变量，只在其所在的代码块 {} 内有效。
console.log(age) // error

词法作用域是在定义时确定的，它关注函数在何处声明。

动态作用域是在运行时确定的（this 也是），它关注函数从何处调用（常与 this 挂钩）。

JavaScript 采用的是词法作用域，又称静态作用域。下面我们来看看示例：

var value = 1

function foo() {
  console.log(value)
}

function bar() {
  var value = 2
  foo()
}

bar() // 1

分析

如果是词法作用域，调用 foo 函数时，会先在其内部作用域中查找，如果找不到，往上一层查找，找到了 value，结果为 1。

如果是动态作用域，调用 foo 函数时，同样会先在其内部作用域中查找，如果找不到，会到调用 foo 函数的作用域中查找（这里是 bar），结果为 2。

一般情况下，变量取值应到创建这个变量的函数的作用域中取值。如果在当前作用域找不到，向上级作用域查找，直到全局作用域，这么一个查找过程形成的链条就叫做作用域链。