作用域的奇技淫巧与“欺骗词法”的江湖传说(下)

134 阅读2分钟

作用域的奇技淫巧与“欺骗词法”的江湖传说(下)

前言

上回说到作用域的基本门派,这次我们来聊聊江湖中的奇技淫巧和那些让人头秃的“欺骗词法”。

一、块级作用域的崛起

ES6 之前,JS 只有函数作用域和全局作用域。自从 let/const 横空出世,块级作用域成为新宠。

{
  let a = 1;
  const b = 2;
  var c = 3;
}
console.log(typeof a); // 
undefined
console.log(typeof b); // 
undefined
console.log(typeof c); // 
number

let/const 只在大括号内有效,var 则“冲出江湖”。

二、暂时性死区(TDZ):新手的噩梦

let/const 声明的变量在声明前不可用,访问就报错,这段时间叫“暂时性死区”。

三、变量提升的陷阱

var 会变量提升,let/const 不会。面试常考:

四、函数声明与变量提升的“江湖恩怨”

函数声明也会提升,但函数表达式不会。

五、作用域链的“连环计”

多层嵌套时,变量查找按作用域链一层层向上,直到全局。

六、闭包的高级玩法

闭包不仅能“记住”变量,还能实现私有变量、工厂函数等高级技巧。

七、with 和 eval 的“江湖禁术”

  • with :极易污染全局,现代开发禁止使用。
  • eval :安全隐患极大,能让代码变得不可控。

八、作用域与内存泄漏

闭包用得不当会导致内存泄漏,比如 DOM 事件绑定后忘了解绑。

九、作用域与模块化

现代 JS 推荐使用模块(ESM、CommonJS)来隔离作用域,避免变量冲突。

十、面试高频题与实战技巧

  1. 变量提升与 TDZ
  2. 闭包实现私有变量
  3. 块级作用域与循环变量
  4. 作用域链查找顺序

十一、结语

作用域是 JS 世界的“武林秘籍”,掌握它,你就是前端江湖的高手。愿你在代码的江湖中,行走自如,所向披靡!