🔥🕺🏼 JavaScript 可视化：提升

提升是每个 JS 开发者都听说过的一个术语，因为你在 Google 上搜索了那个恼人的错误，最后在 StackOverflow 上，这个人告诉你这个错误是由于提升引起的🙃 那么，什么是提升？（仅供参考 -范围将在另一篇文章中介绍，我喜欢保持文章简短而有针对性）

如果你是 JavaScript 新手，你可能遇到过一些“奇怪”的行为，比如一些变量被随机引用undefined、ReferenceError被抛出异常等等。变量提升通常被解释为将变量和函数放在文件顶部，但事实并非如此，尽管行为看起来像是这样 😃

当 JS 引擎获取到我们的脚本时，它做的第一件事就是为代码中的数据设置内存。此时不会执行任何代码，它只是在为执行做准备。函数声明和变量的存储方式有所不同。函数的存储方式是指向整个函数的引用。

对于变量来说，情况有点不同。ES6 引入了两个新的关键字来声明变量：letand const。使用letorconst关键字声明的变量在存储时处于未初始化状态。

使用关键字声明的变量var将存储其默认值undefined。

现在创建阶段已经完成，我们可以实际执行代码了。让我们看看，如果在文件顶部，在声明函数或任何变量之前，添加 3 个 console.log 语句，会发生什么。

由于函数存储了对整个函数代码的引用，因此我们甚至可以在创建它们的行之前调用它们！🔥

当我们引用一个在声明前使用关键字 声明的变量时var，它只会返回其存储的默认值：undefined! 。然而，这有时可能会导致“意外”的行为。在大多数情况下，这意味着你是无意中引用了它（你可能并不希望它实际拥有 的值undefined）。😬

为了防止意外引用undefined变量（就像使用关键字那样），每当我们尝试访问未初始化的var变量时，都会抛出 a 异常。变量实际声明之前的“区域”被称为暂时死区：在变量初始化之前，您无法引用它们（ES6 类也一样！）。ReferenceError

当引擎通过我们实际声明变量的行时，内存中的值将被我们实际声明它们的值覆盖。

（哎呀，我现在注意到这应该是第 7 个。将尽快更新😬）

全部完成！🎉 快速回顾：

• 在执行代码之前，函数和变量会被存储在内存中，作为执行上下文。这被称为提升 (hoisting)。
• 函数存储的是整个函数的引用，带有var关键字 的变量的值为undefined，带有和let关键字 的变量以未初始化 的状态const存储。

既然我们已经了解了代码执行时究竟发生了什么，我希望“提升”这个术语现在能更清晰一些。和往常一样，如果现在还不太明白，也不用担心。你用得越多，就越容易理解。欢迎随时向我寻求帮助，我很乐意帮助你！😃