JavaScript中变量作用域问题：为何无法在函数外部访问变量i？

嘿，这个问题绝对是JavaScript初学者绕不开的经典坑，本质就是变量作用域的规则在起作用，我给你拆解明白：

核心原因：作用域的隔离机制 #

JavaScript里的变量不是随便哪里都能访问的，它的可见范围由声明位置决定：

• 如果你是在函数内部用var声明的i（比如下面的代码）：

  function test() {
    var i = 5;
  }
  test();
  console.log(i); // 报错：i is not defined
  

  var声明的变量属于函数作用域——意思就是这个变量只在它所在的函数内部“存活”，函数外部的代码根本看不到它，就像你把东西放进了带锁的抽屉，外面拿不到一样。

• 要是你用ES6的let或const声明i：

  function test() {
    let i = 5;
  }
  test();
  console.log(i); // 同样报错
  

  这时候i属于块级作用域，而函数本身就是一个块，所以它的可见范围依然被限制在函数内部，而且let/const还有“暂时性死区”的特性，连提前引用都做不到，比var的隔离更严格。

那怎么让外部能访问到这个变量？ #

如果确实需要在外部获取函数内的变量，有几种常见方式，但要注意合理性：

• 返回变量值：让函数把i作为返回值抛出来

  function test() {
    var i = 5;
    return i;
  }
  const result = test();
  console.log(result); // 输出5
  

• 用闭包保留作用域：如果需要后续还能访问（比如变量会变化），闭包是更合适的方式

  function test() {
    var i = 5;
    return function() {
      return i++;
    };
  }
  const getI = test();
  console.log(getI()); // 5
  console.log(getI()); // 6
  

• 不推荐：挂载到全局：直接在函数内给全局变量赋值（不要加var/let/const），但这种做法会污染全局作用域，容易引发命名冲突，尽量别用

  let i; // 全局声明
  function test() {
    i = 5;
  }
  test();
  console.log(i); // 5
  

总的来说，JavaScript的作用域规则是为了帮我们隔离变量、避免意外的命名冲突，函数内部的变量默认就是“私有”的，外部访问不到是正常的语言特性哦～

内容的提问来源于stack exchange，提问作者Sagi Nadav