纵观大厂的前端算法题,有难有易,下面就难度等级划分为几个类型供大家参考。
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;
}