前端面试常考算法题目详解

根据2025年最新前端面试趋势，结合腾讯、阿里等大厂真题，我为你整理了以下高频算法题型及JS实现方案：

---

一、数组/字符串处理

1. 两数之和（哈希表法）

问题：找出数组中两数之和等于目标值的索引

const twoSum = (nums, target) => {const map = new Map();for (let i = 0; i < nums.length; i++) {const complement = target - nums[i];if (map.has(complement)) return [map.get(complement), i];map.set(nums[i], i);  // 存储数值与索引的映射关系}
};
// 时间复杂度O(n)，空间复杂度O(n)

2. 最长无重复子串（滑动窗口）

问题：求字符串中最长不重复字符的子串长度

const lengthOfLongestSubstring = (s) => {let map = new Map(), max = 0, left = 0;for (let right = 0; right < s.length; right++) {if (map.has(s[right])) left = Math.max(left, map.get(s[right]) + 1);map.set(s[right], right);  // 更新字符最新位置max = Math.max(max, right - left + 1);  // 窗口扩展时更新最大值}return max;
};
// 时间复杂度O(n)，空间复杂度O(k)（k为字符集大小）

---

二、排序算法

1. 快速排序（分治思想）

const quickSort = (arr) => {if (arr.length <= 1) return arr;const pivot = arr.pop();const left = arr.filter(x => x <= pivot);const right = arr.filter(x => x > pivot);return [...quickSort(left), pivot, ...quickSort(right)];  // 递归拆分左右数组
};
// 平均时间复杂度O(n log n)，最坏O(n²)

2. 冒泡排序（基础必考）

function bubbleSort(arr) {for (let i = 0; i < arr.length-1; i++) {for (let j = 0; j < arr.length-1-i; j++) {if (arr[j] > arr[j+1]) {[arr[j], arr[j+1]] = [arr[j+1], arr[j]];  // 相邻元素交换}}}return arr;
}
// 时间复杂度O(n²)，空间复杂度O(1)

---

三、链表操作

1. 反转链表（迭代法）

function reverseList(head) {let prev = null, curr = head;while (curr) {const next = curr.next;  // 暂存后续节点curr.next = prev;        // 反转指针方向prev = curr;             // 前移prev指针curr = next;             // 前移curr指针}return prev;
};
// 时间复杂度O(n)，空间复杂度O(1)

2. 合并有序链表（递归）

const mergeTwoLists = (l1, l2) => {if (!l1) return l2;if (!l2) return l1;if (l1.val < l2.val) {l1.next = mergeTwoLists(l1.next, l2);return l1;} else {l2.next = mergeTwoLists(l1, l2.next);return l2;  // 递归拼接较小节点}
};
// 时间复杂度O(m+n)，空间复杂度O(m+n)

---

四、动态规划

1. 爬楼梯问题（斐波那契变种）

const climbStairs = (n) => {let [a, b] = [1, 1];for (let i = 2; i <= n; i++) [a, b] = [b, a + b];  // 滚动数组优化空间return b;
};
// 时间复杂度O(n)，空间复杂度O(1)

2. 最大子序和

const maxSubArray = (nums) => {let pre = 0, maxAns = nums;nums.forEach(x => {pre = Math.max(pre + x, x);  // 判断是否舍弃前面序列maxAns = Math.max(maxAns, pre);});return maxAns;
};
// 时间复杂度O(n)，空间复杂度O(1)

---

五、设计类问题

1. 实现Promise.all

Promise.myAll = (promises) => {return new Promise((resolve, reject) => {let results = [], count = 0;promises.forEach((p, i) => {p.then(res => {results[i] = res;if (++count === promises.length) resolve(results);  // 全部完成后返回}).catch(reject);  // 任一失败立即终止});});
};

2. 节流函数（Throttle）

function throttle(fn, delay) {let last = 0;return (...args) => {const now = Date.now();if (now - last < delay) return;last = now;fn.apply(this, args);  // 固定时间间隔触发};
}

---

高频考点总结

类别	考察重点	常考题型示例
数组	双指针、哈希表应用	两数之和、三数之和
字符串	滑动窗口、正则处理	回文判断、字符串转换
链表	虚拟头节点、快慢指针	环形链表检测、倒数第K个节点
树	递归与迭代转换	层序遍历、对称二叉树判断
系统设计	前端特定场景设计	LRU缓存、发布订阅模式

练习建议：建议在LeetCode上重点练习「前端面试高频题库」标签下的题目，并注意边界条件处理（如空数组、单节点链表等特殊场景）。实际面试中，面试官常会要求手写代码后口述时间/空间复杂度及优化思路。

---