一、什么是作用域作用域变量的合法访问范围简单说变量在哪能⽤、在哪不能⽤由作⽤域决定。JS 一共有三种作用域全局作用域函数作用域块级作用域ES6 新增二、三大作用域详解1. 全局作用域所有函数、大括号外部的区域。全局变量任意位置都能访问。let num 100; // 全局变量 function fn() { console.log(num); // 内部可以访问全局变量 } fn(); console.log(num); // 外部也能访问2. 函数作用域在函数内部产生独立作用域。函数内部定义的变量外部无法访问。function fn() { let msg hello; // 局部变量 console.log(msg); } fn(); // console.log(msg); // 报错外部访问不到3. 块级作用域重点被{ }包裹的代码块if、for、while。核心规则let / const有块级作用域var没有块级作用域if(true){ let a 10; var b 20; } // console.log(a); // 报错块内变量出不去 console.log(b); // 20var 无块级限制三、变量查找规则就近原则JS 查找变量的万能规则先在当前作用域找 → 找不到往上一层找 → 直到全局 → 还找不到报错let num 100; function test(){ let num 200; console.log(num); // 输出 200优先就近 } test();内层变量会遮蔽外层同名变量。四、预解析与变量提升面试必考JS 代码执行分两步预解析扫描整段代码提升变量、函数逐行执行1. var 变量提升var 声明会提升到作用域顶部赋值不提升console.log(a); // undefined var a 10; // 代码等效于 // var a // console.log(a) // a 102. let / const 提升与暂时性死区let、const 也会提升但是存在暂时性死区。必须先声明后使用不能先使用console.log(b); // 直接报错 let b 20;这也是为什么开发弃用 var首选 let/const。3. 函数提升函数声明整体提升可以先调用、后定义sayHi(); function sayHi(){ console.log(你好); }⚠️函数表达式不会提升fn(); // 报错 let fn function(){ console.log(函数表达式) }五、经典面试题解析var a 1; function f(){ console.log(a); var a 2; } f();输出结果undefined解析函数内部var a被提升函数内有自己的 a优先使用内部变量但此时还未赋值所以打印 undefined。六、最终总结作用域控制变量访问范围全局、函数、块级let/const 有块级作用域var 没有变量查找遵循就近原则var 存在变量提升容易出 buglet/const 存在暂时性死区更严谨、安全函数声明提升、函数表达式不提升作用域和预解析是 JS 逻辑底层基石学懂它你就能看懂 90% 的 JS 诡异报错