前端面试常见笔试题

1.防抖

    // 防抖频繁触发事件执行后在执行事件
    let div = document.querySelector('.box');
    const debounce = (func, wait) => {
      let timer;
      return function () {
        clearTimeout(timer);
        timer = setTimeout(() => {
          func();
        }, wait);
      };
    };

    function doSomeThing() {
      console.log('防抖');
    }

    div.onclick = debounce(doSomeThing, 1000);

2.节流

    // 节流  指定时间内频繁触发执行一次
    // 控制频率
    var flg = true;
    // 是否是首次
    var nowDate = true; // ps:这个变量是自己搞得是否首次要直接执行，有更好的方法
    let div = document.querySelector('.box');

    function throttle(callback, time) {
      // 如果flg为false说明函数再时间段范围之内，终止操作
      if (!flg) {
        return;
      }
      flg = false;
      if (!nowDate) {
        // 如果不是第一次进入
        setTimeout(() => {
          callback();
          // flg 为 true 说明不在禁止执行的时间段内
          flg = true;
        }, time);
      } else {
        // 如果是第一次进入
        callback();
        // 首次执行结束之后，设置变量为非首次
        nowDate = false;
        flg = true;
      }
    }
    // 需要节流的操作
    function fn() {
      console.log('节流');
    }

    div.onclick = function () {
      console.log('=====鼠标点击======');
      throttle(fn, 3000);
    };

3.递归深拷贝

    function deepClone(source) {
      if (source === null) return null;
      if (typeof source !== 'object') return source;
      if (source instanceof RegExp) {
        // 判断正则
        return new RegExp(source);
      }
      if (source instanceof Date) {
        // 判断时间对象
        return new Date(source);
      }

      let targetObj = new Object();
      // 判断复制的目标是数组还是对象
      for (let keys in source) {
        // 遍历目标
        if (source.hasOwnProperty(keys)) {
          // 如果值是对象，就递归一下
          targetObj[keys] = deepClone(source[keys]);
        }
      }
      return targetObj;
    }

    const originObj = {
      a: 'a',
      b: 'b',
      c: [1, 2, 3],
      d: { dd: 'dd' },
      e: '\n\g',
    };
    const cloneObj = deepClone(originObj);
    console.log(cloneObj === originObj); // false

    cloneObj.a = 'aa';
    cloneObj.c = [1, 1, 1];
    cloneObj.d.dd = 'doubled';

    console.log(cloneObj); // {a:'aa',b:'b',c:[1,1,1],d:{dd:'doubled'}};
    console.log(originObj); // {a:'a',b:'b',c:[1,2,3],d:{dd:'dd'}};

4.多维数组拍平

    let array = [[41, 3], 2, 5, 6, [1, 5, 6, [2, 35]]];
    const flatten = (arr) => {
      return arr.reduce((acc, val) => {
        // console.log(acc, 'acc');
        return acc.concat(Array.isArray(val) ? flatten(val) : val);
      }, []);
    };
    console.log(flatten(array));

5.实现promise

// 实现promise 

function Promise(executor){ //executor执行器
    let self = this;
    self.status = 'pending'; //等待态
    self.value  = undefined; // 表示当前成功的值
    self.reason = undefined; // 表示是失败的值
    function resolve(value){ // 成功的方法
        if(self.status === 'pending'){
            self.status = 'resolved';
            self.value = value;
        }
    }

    function reject(reason){ //失败的方法
        if(self.status === 'pending'){
            self.status = 'rejected';
            self.reason = reason;
        }
    }
    executor(resolve,reject);
}

Promise.prototype.then = function(onFufiled,onRejected){
    let self = this;
    if(self.status === 'resolved'){
        onFufiled(self.value);
    }
    if(self.status === 'rejected'){
        onRejected(self.reason);
    }
}

6.递归实现累加

	    function addCount(num){
        if(num===1){
            return 1
        }
        return num+addCount(num-1)
    }
    console.log(addCount(5))  // 15	

7.递归 根据子元素找到父级元素

	export function getParent(data2, nodeId2) {
var arrRes = [];
if (data2.length == 0) {
if (nodeId2) {
　　arrRes.unshift(data2);
}
return arrRes;
}
let rev = (data, nodeId) => {
for (var i = 0, length = data.length; i < length; i++) {
let node = data[i];
if (node.id == nodeId) {
　　arrRes.unshift(node);
　　rev(data2, node.pid);
　　break;
} else {
　　if (node.child) {
　　　　rev(node.child, nodeId);
　　　　}
　　　　}
　　　　}
　　　　return arrRes;
　　　　};
　　　　arrRes = rev(data2, nodeId2);
　　　　return arrRes;
　　}

8.判断一个字符串中出现次数最多的字符，统计这个次数

let str = 'asdfssaaasasasasaa'
let json = {}
// 通过对象key值唯一的特性来计算
for (let i = 0; i < str.length; i++) {
    if(!json[str.charAt(i)]) {
      json[str.charAt(i)] = 1
    } else {
      json[str.charAt(i)]++
    }
};

let iMax = 0
let iIndex = ''
for(let i in json) {
    if(json[i] > iMax) {
      iMax = json[i]
      iIndex = i
    }
}
console.log('出现次数最多的是:' + iIndex + '出现' + iMax + '次')