一、作用域：变量与函数的生存空间

1.1 作用域的核心定义

作用域（Scope）是JavaScript中变量和函数可访问的上下文环境，决定了代码中标识符（变量名、函数名）的可见性和生命周期。它像一座”隐形的围墙”，将变量限制在特定区域内，避免命名冲突。

示例：

function outer() {
  var outerVar = '外部变量';
  function inner() {
    console.log(outerVar); // 可访问外部变量
  }
  inner();
}
outer();
// console.log(outerVar); // 报错：outerVar未定义

此例中，outerVar的作用域仅限于outer函数内部，外部无法直接访问。

1.2 作用域的分类与特性

全局作用域：脚本最外层定义，任何位置均可访问（但过度使用会导致全局污染）。
函数作用域：函数内部定义的变量仅在函数内有效（var的特性）。
块级作用域（ES6+）：通过let/const定义，在{}、循环或条件语句中生效。

面试题：
var与let在作用域上的主要区别是什么？
答案：var是函数作用域，存在变量提升；let是块级作用域，无变量提升且存在暂时性死区（TDZ）。

二、作用域链：变量查找的”路径导航”

2.1 作用域链的构成原理

当函数执行时，会创建一个执行上下文（Execution Context），其中包含变量环境（Variable Environment）和词法环境（Lexical Environment）。作用域链（Scope Chain）即通过这些环境的嵌套关系形成的变量查找链。

查找规则：
从当前作用域开始，逐级向上查找，直到全局作用域。若未找到，则报错ReferenceError。

示例：

var globalVar = '全局';
function parent() {
  var parentVar = '父级';
  function child() {
    console.log(parentVar); // 查找路径：child → parent → 全局
    console.log(globalVar);
  }
  child();
}
parent();

2.2 动态与静态作用域的对比

静态作用域（词法作用域）：JavaScript采用此模式，作用域链在函数定义时确定（与调用位置无关）。
动态作用域：作用域链在函数调用时确定（如Bash脚本），JavaScript不支持。

面试题：
以下代码输出什么？为什么？

var scope = 'global';
function checkScope() {
  console.log(scope);
}
function outer() {
  var scope = 'outer';
  checkScope();
}
outer(); // 输出 'global'

答案：JavaScript是词法作用域，checkScope的作用域链在定义时已绑定全局scope。

三、闭包：作用域的”持久化封装”

3.1 闭包的定义与本质

闭包（Closure）是指能够访问自由变量（非局部变量）的函数，即函数记住并持续访问其定义时的作用域链，即使该函数在其词法作用域之外执行。

核心条件：

函数嵌套；
内部函数引用了外部函数的变量；
外部函数执行后，内部函数被返回或保留。

示例：

function createCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  };
}
const counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2

counter函数闭包了createCounter的count变量，使其状态得以保留。

3.2 闭包的常见应用场景

数据封装：模拟私有变量。

function createPerson(name) {
  let _name = name;
  return {
    getName: () => _name,
    setName: (newName) => { _name = newName; }
  };
}
const person = createPerson('Alice');
person.setName('Bob');
console.log(person.getName()); // 'Bob'

函数柯里化：保存部分参数。

function multiply(a) {
  return function(b) {
    return a * b;
  };
}
const double = multiply(2);
console.log(double(5)); // 10

事件回调与异步编程：保持上下文。

for (var i = 0; i < 3; i++) {
  setTimeout(function() {
    console.log(i); // 输出3次3（var的坑）
  }, 100);
}
// 使用闭包修复：
for (var i = 0; i < 3; i++) {
  (function(j) {
    setTimeout(() => console.log(j), 100); // 输出0,1,2
  })(i);
}

3.3 闭包的内存管理

闭包会长期持有外部变量引用，可能导致内存泄漏。需手动解除引用：

let closure;
function init() {
  const data = '大量数据';
  closure = function() {
    console.log(data);
  };
  // 使用后解除引用
  // closure = null;
}
init();
closure();

面试题：
以下代码可能导致什么问题？如何优化？

function heavySetup() {
  const largeData = new Array(1000000).fill('*');
  return function() {
    console.log('操作数据');
  };
}
const unusedClosure = heavySetup(); // largeData未被释放

答案：闭包保留了largeData的引用，导致内存无法回收。优化方式：在不需要时将闭包赋值为null。

四、面试真题解析与实战建议

4.1 经典面试题

题目1：
输出以下代码结果，并解释原因。

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

解析：let创建块级作用域，每次循环生成新的i绑定。

题目2：
如何实现一个私有变量？

const obj = (function() {
  let privateVar = 'secret';
  return {
    getSecret: () => privateVar
  };
})();
console.log(obj.getSecret()); // 'secret'
console.log(obj.privateVar); // undefined

4.2 开发者实战建议

合理使用闭包：在需要状态保持时使用，避免滥用导致内存问题。
优先选择块级作用域：用let/const替代var，减少意外变量泄露。
调试技巧：通过Chrome DevTools的”Scope”面板查看闭包变量。
性能优化：对于高频调用的闭包函数，注意其内部变量的体积。

五、总结与延伸

作用域、作用域链和闭包是JavaScript的核心机制，理解它们有助于：

避免变量污染和命名冲突；
优化代码结构与内存使用；
通过闭包实现高级编程模式（如模块化、柯里化）。

延伸学习：

ES6模块系统与块级作用域的协作；
Web Workers中的作用域隔离；
V8引擎对闭包的优化策略。

掌握这些概念后，开发者将能编写出更健壮、高效的JavaScript代码，并在面试中脱颖而出。

（附面试题）深入理解作用域、作用域链和闭包