返回

2021 前端高频算法梳理：能力进阶，蓄势待发

前端

在前端技术领域，算法不仅是技术深度的体现，更是面试中的关键考点。掌握核心算法能够帮助前端工程师在求职和技术提升的道路上更进一步。本文将为大家梳理前端高频面试算法，助力大家在技术竞争中脱颖而出。

一、排序算法

排序算法是数据结构和算法中的基础概念，常见排序算法包括冒泡排序、选择排序、插入排序、快速排序和堆排序。

冒泡排序

冒泡排序通过不断交换相邻元素来完成排序，时间复杂度为 O(n^2)。

function bubbleSort(arr) {
    let len = arr.length;
    for (let i = 0; i < len; i++) {
        for (let j = 0; j < len - 1 - i; j++) {
            if (arr[j] > arr[j + 1]) {
                [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
            }
        }
    }
    return arr;
}

快速排序

快速排序是一种分治算法，时间复杂度为 O(n log n)。

function quickSort(arr) {
    if (arr.length <= 1) return arr;
    let pivot = arr[Math.floor(arr.length / 2)];
    let left = [], right = [];
    for (let i = 0; i < arr.length; i++) {
        if (i === Math.floor(arr.length / 2)) continue;
        if (arr[i] < pivot) left.push(arr[i]);
        else right.push(arr[i]);
    }
    return quickSort(left).concat(pivot, quickSort(right));
}

二、查找算法

查找算法是数据结构和算法中的重要概念，常见查找算法包括线性查找、二分查找和哈希表查找。

二分查找

二分查找通过将数组划分为两半来查找目标元素，时间复杂度为 O(log n)。

function binarySearch(arr, target) {
    let left = 0, right = arr.length - 1;
    while (left <= right) {
        let mid = Math.floor((left + right) / 2);
        if (arr[mid] === target) return mid;
        else if (arr[mid] < target) left = mid + 1;
        else right = mid - 1;
    }
    return -1;
}

三、字符串匹配算法

字符串匹配算法是前端面试中的重点领域，常见字符串匹配算法包括 KMP 算法和 BM 算法。

KMP 算法

KMP 算法通过预处理字符串构建失败函数来快速匹配字符串，时间复杂度为 O(n + m)。

function kmpSearch(text, pattern) {
    let lps = computeLPSArray(pattern);
    let i = 0, j = 0;
    while (i < text.length) {
        if (pattern[j] === text[i]) {
            i++; j++;
        }
        if (j === pattern.length) return i - j;
        else if (i < text.length && pattern[j] !== text[i]) {
            if (j !== 0) j = lps[j - 1];
            else i++;
        }
    }
    return -1;
}

function computeLPSArray(pattern) {
    let lps = new Array(pattern.length).fill(0);
    let len = 0, i = 1;
    while (i < pattern.length) {
        if (pattern[i] === pattern[len]) {
            len++; lps[i] = len; i++;
        } else {
            if (len !== 0) len = lps[len - 1];
            else {
                lps[i] = 0; i++;
            }
        }
    }
    return lps;
}

四、图算法

图算法是前端面试中的重要领域，常见图算法包括深度优先搜索和广度优先搜索。

深度优先搜索

深度优先搜索通过从某个节点出发，沿着一条路径深度搜索，时间复杂度为 O(V + E)。

function dfs(graph, start) {
    let visited = new Set();
    function traverse(node) {
        if (visited.has(node)) return;
        visited.add(node);
        console.log(node);
        for (let neighbor of graph[node]) {
            traverse(neighbor);
        }
    }
    traverse(start);
}

五、动态规划

动态规划通过将问题分解成较小的子问题，并保存子问题的解，时间复杂度通常为 O(n^2) 或 O(n^3)。

斐波那契数列

function fibonacci(n) {
    let dp = [0, 1];
    for (let i = 2; i <= n; i++) {
        dp[i] = dp[i - 1] + dp[i - 2];
    }
    return dp[n];
}

六、总结

以上只是前端高频面试算法的冰山一角。要想在面试中脱颖而出，除了掌握这些算法外，还需要有扎实的数据结构和算法基础。同时，也要多做练习，提高自己的编程能力和算法思维。相信通过努力，大家一定能够在求职和技术提升的道路上更进一步。

相关资源链接