js手写几个常见的面试题

手动实现 Arrar.prototype.map方法

• map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

function map(arr,mapCallback) {
    首先检测传递的参数是否正确
    if(!Arrar.isArray(arr) || !arr.length || typeof mapCallback !== 'function') {
        return []
    } else {
        let result = [];
        for(let i = 0,len = arr.length;i<len;i++) {
            result.push(mapCallback(arr[i],i,arr))
        }
        return result
    }
}

手动实现Array.prototype.filter方法

• filter()方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

function filter(arr,filterCallback) {
    if(!Array.isArray(arr) || !arr.length || typeof filterCallback !== 'function') {
        return []
    } else {
        let result = [];
        for (let i=0,len=arr.length;i<len;i++) {
            if(filterCallback(arr[i],i,arr)) {
                result.push(arr[i])
            }
        }
        return result
    }
}

JS的节流和防抖

• 函数防抖 是指在事件被触发 n 秒后再执行回调，如果在这 n 秒内事件又被触发，则重新计时。这可以使用在一些点击请求的事件上，避免因为用户的多次点击向后端发送多次请求。

// 函数防抖的实现
function debounce(fn, wait) {
  var timer = null;

  return function() {
    var context = this,
      args = arguments;

    // 如果此时存在定时器的话，则取消之前的定时器重新记时
    if (timer) {
      clearTimeout(timer);
      timer = null;
    }

    // 设置定时器，使事件间隔指定事件后执行
    timer = setTimeout(() => {
      fn.apply(context, args);
    }, wait);
  };
}

• 函数节流 是指规定一个单位时间，在这个单位时间内，只能有一次触发事件的回调函数执行，如果在同一个单位时间内某事件被触发多次，只有一次能生效。节流可以使用在 scroll 函数的事件监听上，通过事件节流来降低事件调用的频率。

function throttle(fn, delay) {
  var preTime = Date.now();

  return function() {
    var context = this,
      args = arguments,
      nowTime = Date.now();

    // 如果两次时间间隔超过了指定时间，则执行函数。
    if (nowTime - preTime >= delay) {
      preTime = Date.now();
      return fn.apply(context, args);
    }
  };
}

多维数组处理一维数组

export const flatten = (arr) => {
  while (arr.some((item) => Array.isArray(item))) {
    arr = [].concat(...arr)
  }
  return arr
}
例如:
arr = [1,2,3,[22,33,44,[55,66,77,[88,99,100]]]]
flatten(arr)  => [1, 2, 3, 22, 33, 44, 55, 66, 77, 88, 99, 100]

以上就是面试中，最常见的几道题