前端面试题-手写

1.统计字符串中字符出现的次数

统计字符串中字符出现的次数

/**
 * @description 统计字符串中字符出现的次数
 * @param str
 * @returns {{}}
 */
function computeString(str) {
  var obj = {};
  for (var i = 0; i < str.length; i++) {
    var key = str[i];
    if (obj[key]) {
      obj[key]++;
    } else {
      obj[key] = 1;
    }
  }
  return obj;
}
computeString("12121111");

2. 函数防抖

函数防抖

/**
 * @description 函数防抖
 * @param func
 * @param wait
 * @returns {(function(...[*]): void)|*}
 */
function debounce(func, wait = 50) {
  // 缓存一个定时器id
  let timer = 0;
  // 这里返回的函数是每次用户实际调用的防抖函数
  // 如果已经设定过定时器了就清空上一次的定时器
  // 开始一个新的定时器，延迟执行用户传入的方法
  return function (...args) {
    if (timer) clearTimeout(timer);
    timer = setTimeout(() => {
      func.apply(this, args);
    }, wait);
  };
}
const task = () => {
  console.log("run task");
};
const debounceTask = debounce(task, 1000);
window.addEventListener("scroll", debounceTask);

3. 函数节流

函数节流

/**
 * @description 函数节流
 * @param func
 * @param ms
 * @returns {(function(...[*]): void)|*}
 */
function throttle(func, ms = 1000) {
  let canRun = true;
  return function (...args) {
    if (!canRun) return;
    canRun = false;
    setTimeout(() => {
      func.apply(this, args);
      canRun = true;
    }, ms);
  };
}
const task = () => {
  console.log("run task");
};
const throttleTask = throttle(task, 1000);
window.addEventListener("scroll", throttleTask);

4. 手写数组去重

手写数组去重

/**
 * @description 手写数组去重
 * @param arr
 * @returns {*[]}
 */
function uniqueArray(arr) {
  let newArr = [];
  for (let i = 0; i < arr.length; i++) {
    if (newArr.indexOf(arr[i]) === -1) {
      newArr.push(arr[i]);
    }
  }
  return newArr;
}
uniqueArray([1, 2, 1, 2, 3, 1, 2]);

5. url 参数转换为 object

url 参数转换为 object

/**
 * @description url参数转换为object
 * @param str
 * @returns {{}}
 */
function urlToObj(str) {
  let obj = {};
  let strQuery = str.split("?");
  let strArray = strQuery[1] ? strQuery[1].split("&") : [];
  for (let i = 0; i < strArray.length; i++) {
    let info = strArray[i].split("=");
    obj[info[0]] = info[1];
  }
  return obj;
}

var url = "http://www.baidu.com?a=1&b=2&c=3";
urlToObj(url);
urlToObj("http://www.baidu.com");