幽微奥秘，让其层见迭出——非严格模式函数提升

群内友邻近日抛出一个变量提升相关的疑问，这激发了我的灵感，促使我撰写此文。文内将针对非严格模式下函数声明和赋值语句先后顺序对变量提升的影响进行细致分析。除此之外，还会对函数提升和变量提升的概念进行简要介绍，并分享一些相关细枝末节，相信有助于大家更好地理解和掌握JavaScript的变量提升机制。

起初，我们先观察两种情况下的代码和运行结果。

情况一

function func() {
  console.log(a); // 输出：undefined
  var a = 1;
}

func();

情况二

var a;
function func() {
  console.log(a); // 输出：undefined
  a = 1;
}

func();

在这两种情况下，函数声明和赋值语句的先后顺序存在差异。

非严格模式

针对非严格模式的情况，上面提到的两种情况分别表现如下。

情况一

function func() {
  a = 1;
  console.log(a); // 输出：1
}

func();

情况二

var a;
function func() {
  console.log(a); // 输出：undefined
  a = 1;
}

func();

非严格模式下，无论函数声明和赋值语句的先后顺序如何，变量提升都会发生。也就是说，函数声明和变量声明都会被提升到函数顶部，而赋值语句则会留在原地。

严格模式

接下来我们来看严格模式下函数声明和赋值语句先后顺序对变量提升产生的影响。

情况一

"use strict";
function func() {
  console.log(a); // 报错：ReferenceError: a is not defined
  a = 1;
}

func();

情况二

"use strict";
var a;
function func() {
  console.log(a); // 输出：undefined
  a = 1;
}

func();

在严格模式下，函数声明和赋值语句的先后顺序会对变量提升产生影响。如果函数声明在变量声明之前，则变量提升不会发生。因此，第一种情况下，a变量未声明，就会报错。而第二种情况下，a变量声明在函数声明之前，因此变量提升会发生，a变量会被提升到函数顶部，并被赋予undefined值。

总结

通过对以上各种情况的分析，我们可以得出以下结论：

• 在非严格模式下，函数声明和变量声明都会被提升到函数顶部，而赋值语句则会留在原地。
• 在严格模式下，如果函数声明在变量声明之前，则变量提升不会发生。
• 变量提升会带来一些潜在的陷阱，因此在实际开发中应尽量避免使用。

最佳实践

为了避免变量提升带来的陷阱，我们可以遵循以下最佳实践：

• 始终使用严格模式。
• 在函数顶部声明所有变量。
• 避免在函数内部声明变量。
• 使用立即执行函数表达式（IIFE）来创建私有作用域。

我希望这篇博文能够帮助您更好地理解和掌握JavaScript的变量提升机制。如果您有任何问题或建议，欢迎在评论区留言。