前端算法题的修炼等级-CSDN博客

纵观大厂的前端算法题，有难有易，下面就难度等级划分为几个类型供大家参考。

1. 熟练掌握语言的基本语法以及常用函数的基本用法（1星难度）

展开一个数组，数组最多二维：[[1,2],[3,4]] => [1,2,3,4]

解答：主要考察spread运算符以及数组的concat用法。

function flatten(arr) {
    return [].concat(...arr);
}

2. 使用递归，以及其他高级应用的实现（2星难度）

例1：展开一个数组（多维）： [[1,2],3,[4,[5,6,[7,8]]]] => [1,2,3,4,5,6,7,8]
解答：考察递归的思想，其实递归是一种数学思想，把问题本身转化为能够用递归的形式表示的数学公式，那么再复杂的递归问题也可以迎刃而解。

function flatten(arr) {
    return [].concat(
        ...arr.map(e => {
        Array.isArray(e) ? flatten(e) : e;
    }));
}

例2：写一个节流函数，使得用户滚动滚动条的时候每60ms才触发一次scroll事件
解答：利用“加锁”的思想。

function throttle(func, delay = 30) {
    let lock = false;
    return (...args) => {
        if(lock) return;
        func(...args);
        lock = true;
        setTimeout(() => {lock = false}, delay);
    }
}
document.addEventListener("scroll", throttle(console.log("scrolling")));

例3：写一个节流函数，使得用户输入停止后300ms才触发验证
解答：每来一次事件，都重启计数器。

function throttle(func, delay = 300, timeoutId = null) {
    return (...args) => {
        clearTimeout(timeoutId);
        timeoutId = setTimeout((...args) => func(...args), delay)
    }
}

3. 函数式编程（3星难度）

实现函数柯里化
解答：柯里化通常也称部分求值，其含义是给函数分步传递参数，每次传递参数后部分应用参数，并返回一个更具体的函数接受剩下的参数，这中间可嵌套多层这样的接受部分参数函数，直至返回最后结果。

const curry = (func) => {
    const g = (...allArgs) => allArgs.length >= func.length ?
            func(...allArgs) :
            (...args) => g(...allArgs, ...args);
    return g;
}