一句话概括 手写 Vue3 响应式系统的核心——reactive、effect、computed——本质上就是利用 Proxy 拦截对象读写 + 依赖收集 + 调度执行的三大机制组合，不到 200 行代码即可实现核心逻辑。 一、背景与意义 1.1 从框架演进看响应式 前端框架的发展史，本质上就是状态与视图同步方式的进化史： 时代 代表 ...

一句话概括 虚拟列表（Virtual List）通过只渲染可视区域内的 DOM 节点，将万级列表渲染性能提升到与几十条数据相当的级别，是前端大列表场景下最核心的性能优化手段。 一、背景与意义 1.1 大列表渲染的痛点 在 Web 应用开发中，渲染大规模列表数据一直是性能瓶颈。以一个典型的用户活动流页面为例：某社交平台需要展示用户最近一年的操作记录，数据量可能达到 5 万条甚至更多。 ...

一句话概括 并发调度器与 LRU 缓存是前端工程中两个”貌合神离”的核心基础设施——调度器通过流量整形解决资源竞争问题，LRU 缓存通过淘汰策略解决内存有限与热数据加速的永恒矛盾，两者在「有限资源下的最优分配」这一本质上殊途同归。 背景与意义 两个看似独立的题目，为何放在一起？ 在面试中，手写「带并发限制的调度器」和「LRU 缓存」经常被放在一起考察，背后有深层逻辑： 有限资...

一句话概括 手写数组方法（map/filter/reduce/flat）是 JavaScript 函数式编程的基础试炼——每个方法都蕴含了”高阶函数 + 迭代器模式 + 内存管理”的底层逻辑，而 flat 的多层展开则涉及递归/栈/迭代器三种实现策略的博弈。 背景与意义 为什么面试爱考数组手写题 数组的 map、filter、reduce、flat 是日常开发中使用频率最高的方法。但...

一句话概括 发布订阅（Pub/Sub）与观察者（Observer）模式是 JavaScript 中两种实现”一对多依赖关系”的设计模式——观察者模式是”主体直接通知观察者”的紧耦合，发布订阅模式通过”事件通道”实现发布者和订阅者的完全解耦，两者是构建事件驱动架构的基石。 背景与意义 设计模式的现实映射 在构建复杂的单页应用时，组件之间的通信是一个永恒的问题： 场景 1：用户在购物车...

一句话概括 深拷贝和浅比较是 JavaScript 引用类型操作的”双刃剑”——深拷贝需要遍历对象图、处理循环引用、兼容所有内置类型（Symbol/Map/Set/Date/RegExp/BigInt等），而浅比较则需要精确判断值类型和引用类型的差异，是 React 性能优化的核心理论基础。 背景与意义 引用类型的困境 JavaScript 的对象赋值是按引用传递的，这意味着： c...

一句话概括 手写 Promise 全家桶是检验 JavaScript 异步编程理解的终极试金石——从遵守 Promises/A+ 规范的完整 Promise 实现，到 Promise.all/Promise.race/Promise.allSettled/Promise.any 的精准逻辑，彻底吃透异步控制流的每一个细节。 背景与意义 为什么面试必考手写 Promise 在 Java...

一句话概括 防抖（Debounce）与节流（Throttle）通过精巧的定时器策略控制函数执行频率，而 call/apply/bind 则是 JavaScript 中手动绑定 this 的核心机制；理解这些手写实现的完整面（包括各种边界条件、隐式绑定退化、new 调用覆盖）是区分”会用”和”真懂”的分水岭。 背景与意义 防抖与节流的日常困境 每天早上打开 IDE，你都会遇到这些场景：...

一句话概括 伪类（Pseudo-classes）和伪元素（Pseudo-elements）是 CSS 选择器的两大扩展机制：伪类用单冒号 : 描述元素的状态或位置（如 :hover、:nth-child），伪元素用双冒号 :: 创建元素的虚拟子节点或片段（如 ::before、::first-line）。两者都不需要修改 HTML 结构，却能实现复杂的样式控制。 背景与意义 CSS 的...

一句话概括 CSS 动画体系由 transition（过渡） 和 animation（动画） 两大核心组成：transition 负责”从 A 到 B 的状态变化”，animation + @keyframes 负责”多阶段、可循环的复杂运动”，两者底层都依赖浏览器的合成器线程来实现高性能渲染。 背景与意义 为什么需要 CSS 动画？ 在早期的 Web 开发中，实现动画效果主要依赖 ...