JavaScript变量作用域小结¶

JS的变量作用域有点乱，这和JS的发展历程有关。

全局作用域和函数作用域¶

很久以前，JS里只能通过var关键字定义变量，此时的变量只有两种作用域：

• 全局作用域（Global Scope）
  • 在函数外面定义的变量拥有全局作用域。
  • 在代码的任何地方都可以访问这些变量。
• 函数作用域（Function Scope）
  • 在函数内部定义的变量拥有函数作用域。
  • 只有在定义该变量的函数内部才可以访问这些变量。

ES6引入了块作用域¶

ES6出现后，我们可以通过let和const关键字来定义变量，let和const定义的变量也有两种作用域：

• 块级作用域（Block Scope）
  • 在{}内部定义的变量拥有块级作用域。
  • 只有在定义该变量的{}内部才可以访问这些变量。
• 全局作用域（Global Scope）
  • 不在{}内部定义的变量拥有全局作用域。
  • 在代码的任何地方都可以访问这些变量。
  • 实际上，和上一章节var变量的全局作用域基本一样。

这里有个特殊情况，在函数里通过let和const定义的变量，既拥有函数作用域，也拥有块级作用域。因为，函数本身也是一个特殊的“块”，毕竟所有函数都包含了一个{}。

一个特殊情况¶

有一种情况，代码根本没声明变量，却直接给变量赋值了。这时，无论你是在函数内部还是外部执行这个赋值操作，JS都会在实际赋值语句执行时自动帮你声明一个全局作用域的变量。

注意加粗的文字，一定是在实际赋值语句执行时做自动的变量声明。这意味着，如果你在一个函数里做无声明赋值，但是这个函数没有被实际执行，那么JS并不会声明该变量。

假如你在代码里通过"use strict";启用了严格模式，上述特殊情况是不会出现的，浏览器会报错Uncaught ReferenceError: xxx is not defined。

本文为kyleblog.cn原创，转载请注明出处：https://www.kyleblog.cn/posts/js_scope