数据结构

数据结构是组织和存储数据的方式，它直接决定了算法的效率与代码的可维护性。在前端面试中，无论是手写题、LeetCode 环节还是项目里的状态管理、虚拟 DOM diff、组件树遍历，背后都离不开对数据结构的理解。掌握数据结构，不仅是「写得出代码」，更是「想得清问题」。

为什么前端要学数据结构

• 面试硬通货：大厂前端 rounds 中，算法题 80% 以上考察数组、链表、树、栈/队列、哈希表等基础结构。
• 源码读得懂：React Fiber 链表树、Vue3 响应式 Map/Set、Lodash 内部缓存 LRU，都建立在经典结构之上。
• 业务写得优：树形组件、路由匹配、依赖收集、撤销栈、虚拟列表，本质都是数据结构的应用。
• JS 语言契合度高：JS 原生提供 Array、Map、Set、Object，几乎可以一一对应到经典结构，但又有自己的「坑」（如稀疏数组、对象键顺序），需要专门梳理。

JS 视角下的数据结构

JavaScript 中没有 Java/C++ 那样丰富的标准库容器，但语言本身提供了几大利器：

JS 内置	对应经典结构	备注
Array	动态数组 / 栈 / 队列	随机访问 O(1)，头部插入 O(n)
Object	哈希表	键只能是 string / Symbol
Map	哈希表（有序）	键可为任意类型，保留插入顺序
Set	哈希集合	唯一性，O(1) 判断存在
WeakMap / WeakSet	弱引用哈希	键被回收后自动清除，适合做缓存关联
闭包 + 嵌套对象	链表 / 树 / 图	通过引用手动构建

在面试中能用原生结构就别造轮子，但要做到「既能用 API，也能手写底层实现」。

本模块内容

序号	文章	主题
1	数组	JS 数组本质、扩容、复杂度、双指针
2	链表	单/双/环形链表、反转、合并、检测环、找中点
3	栈与队列	定义、JS 实现、括号匹配、单调栈、滑动窗口最大值
4	哈希表	哈希函数、冲突解决、Map/Set/Object 对比、LRU 缓存
5	树	二叉树/BST、四种遍历（递归+迭代）、深度/翻转/LCA/序列化
6	图	邻接矩阵/表、BFS/DFS、连通分量、最短路径、拓扑排序

学习路径建议

1. 先吃透数组与哈希表：覆盖 60% 以上的面试题，是后续结构的基础。
2. 链表与树重手写：反复练习反转、遍历的迭代写法，建立指针操作的肌肉记忆。
3. 栈与队列重应用：单调栈、双端队列是中高频题型，配合 LeetCode 标签集中突破。
4. 图作为压轴：BFS/DFS 是核心，最短路径与拓扑排序理解模板即可。
5. 配套算法：数据结构与算法是「体」与「用」的关系，本站 算法 分类提供了具体算法题与技巧，建议两模块交叉阅读。

一句话总结：结构决定算法，算法依赖结构。先把「数据放哪里」想清楚，再思考「怎么操作」，往往事半功倍。