作用域与闭包

在JavaScript中，作用域和闭包是理解代码执行逻辑的关键概念。作用域决定了变量的可见性，而闭包则允许函数访问并操作其外部作用域的变量，即使外部函数已经执行完毕。这两者共同构成了JavaScript中变量生命周期和函数行为的基础。

作用域的类型

JavaScript中的作用域主要分为全局作用域、函数作用域和块级作用域（ES6引入）。全局作用域中声明的变量可以在代码的任何地方访问，而函数作用域和块级作用域则限制了变量的可见性。

// 全局作用域
var globalVar = "I'm global";

function foo() {
  // 函数作用域
  var functionVar = "I'm in foo";
  console.log(globalVar); // 可以访问全局变量
}

foo();
console.log(functionVar); // 报错：functionVar未定义

ES6的let和const引入了块级作用域，使得变量仅在声明它们的代码块内有效：

if (true) {
  let blockVar = "I'm in block";
  console.log(blockVar); // 正常输出
}
console.log(blockVar); // 报错：blockVar未定义

作用域链

当代码在一个作用域中访问变量时，JavaScript会沿着作用域链向上查找，直到找到该变量或到达全局作用域。作用域链的构建与函数的定义位置相关，而非调用位置。

var outerVar = "outer";

function outer() {
  var middleVar = "middle";

  function inner() {
    var innerVar = "inner";
    console.log(outerVar, middleVar, innerVar); // 可以访问所有变量
  }

  inner();
}

outer();

闭包的定义与原理

闭包是指函数能够记住并访问其词法作用域，即使函数在其词法作用域之外执行。闭包的形成通常发生在嵌套函数中，内部函数引用了外部函数的变量。

function createCounter() {
  let count = 0;
  return function() {
    count++;
    console.log(count);
  };
}

const counter = createCounter();
counter(); // 1
counter(); // 2

在这个例子中，createCounter返回的函数形成了一个闭包，能够持续访问和修改count变量，即使createCounter已经执行完毕。

闭包的实际应用

闭包在JavaScript中有许多实际用途，例如实现私有变量、模块化开发和函数柯里化。

私有变量

通过闭包可以模拟私有变量的行为：

function createPerson(name) {
  let age = 0;
  return {
    getName: () => name,
    getAge: () => age,
    incrementAge: () => age++
  };
}

const person = createPerson("Alice");
console.log(person.getName()); // "Alice"
console.log(person.getAge()); // 0
person.incrementAge();
console.log(person.getAge()); // 1

模块模式

闭包是实现模块化的基础：

const calculator = (function() {
  let result = 0;

  return {
    add: function(x) {
      result += x;
    },
    subtract: function(x) {
      result -= x;
    },
    getResult: function() {
      return result;
    }
  };
})();

calculator.add(5);
calculator.subtract(2);
console.log(calculator.getResult()); // 3

闭包与内存管理

虽然闭包非常有用，但不当使用可能导致内存泄漏。因为闭包会保持对外部变量的引用，这些变量不会被垃圾回收机制回收，即使它们已经不再需要。

function createHugeArray() {
  const hugeArray = new Array(1000000).fill("data");
  return function() {
    console.log(hugeArray.length);
  };
}

const keepHugeArray = createHugeArray();
// 即使不再需要hugeArray，它仍然被闭包引用，无法被回收

常见误区与陷阱

理解闭包时容易遇到一些常见问题：

1. 循环中的闭包：在循环中创建闭包时，如果不注意，可能会导致意外的行为。

for (var i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i); // 输出5个5
  }, 100);
}

解决方案是使用let或创建新的作用域：

for (let i = 0; i < 5; i++) {
  setTimeout(function() {
    console.log(i); // 输出0,1,2,3,4
  }, 100);
}

2. 意外的全局变量：在严格模式下，未声明的变量会报错，而非严格模式下会创建全局变量。

function leakyFunction() {
  accidentalGlobal = "oops"; // 在非严格模式下创建全局变量
}

性能考量

闭包会影响JavaScript引擎的优化能力，因为变量必须保存在内存中，而不是在函数执行完毕后立即释放。在性能关键的代码中，应谨慎使用闭包。

function performanceSensitive() {
  const data = fetchHugeData(); // 假设这是一个大数据获取操作
  return function process() {
    // 处理data
  };
}
// 即使process可能不需要所有data，闭包也会保留整个data

现代JavaScript中的闭包

随着ES6+的普及，闭包的使用方式也在演变。箭头函数、模块系统和新的作用域规则都影响了闭包的使用模式。

// 使用箭头函数的闭包
const makeAdder = x => y => x + y;
const add5 = makeAdder(5);
console.log(add5(3)); // 8

模块系统提供了更清晰的封装方式，减少了全局闭包的需求：

// module.js
let privateVar = 0;
export function increment() {
  privateVar++;
}
export function getValue() {
  return privateVar;
}