常见前端面试题总结（一）

最新推荐文章于 2024-07-24 10:10:12 发布

beifeng11996

最新推荐文章于 2024-07-24 10:10:12 发布

阅读量190

点赞数

文章标签：前端 java javascript

本文链接：https://blog.csdn.net/beifeng11996/article/details/126296420

版权

这篇博客总结了前端面试中常见的知识点，包括深拷贝考虑Symbol类型、setTimeout与setInterval的区别、requestAnimationFrame的特性、正向代理与反向代理的对比、代码执行流程解析、数据类型判断、闭包概念、JSON理解、浏览器缓存的必要性以及Webpack优化技巧。还探讨了JavaScript内置对象、正则表达式、数组判断方法和浏览器主要组成部分。

摘要由CSDN通过智能技术生成

深拷贝（考虑到复制 Symbol 类型）

题目描述:手写 new 操作符实现

实现代码如下:

function isObject(val) {
   
  return typeof val === "object" && val !== null;
}

function deepClone(obj, hash = new WeakMap()) {
   
  if (!isObject(obj)) return obj;
  if (hash.has(obj)) {
   
    return hash.get(obj);
  }
  let target = Array.isArray(obj) ? [] : {
   };
  hash.set(obj, target);
  Reflect.ownKeys(obj).forEach((item) => {
   
    if (isObject(obj[item])) {
   
      target[item] = deepClone(obj[item], hash);
    } else {
   
      target[item] = obj[item];
    }
  });

  return target;
}

// var obj1 = {
   
// a:1,
// b:{a:2}
// };
// var obj2 = deepClone(obj1);
// console.log(obj1);
复制代码

setTimeout、setInterval、requestAnimationFrame 各有什么特点？

异步编程当然少不了定时器了，常见的定时器函数有 setTimeout、setInterval、requestAnimationFrame。最常用的是setTimeout，很多人认为 setTimeout 是延时多久，那就应该是多久后执行。

其实这个观点是错误的，因为 JS 是单线程执行的，如果前面的代码影响了性能，就会导致 setTimeout 不会按期执行。当然了，可以通过代码去修正 setTimeout，从而使定时器相对准确：

let period = 60 * 1000 * 60 * 2
let startTime = new Date().getTime()
let count = 0
let end = new Date().getTime() + period
let interval = 1000
let currentInterval = interval
function loop() {
   
  count++
  // 代码执行所消耗的时间
  let offset = new Date().getTime() - (startTime + count * interval);
  let diff = end - new Date().getTime()
  let h = Math.floor(diff / (60 * 1000 * 60))
  let hdiff = diff % (60 * 1000 * 60)
  let m = Math.floor(hdiff / (60 * 1000))
  let mdiff = hdiff % (60 * 1000)
  let s = mdiff / (1000)
  let sCeil = Math.ceil(s)
  let sFloor = Math.floor(s)
  // 得到下一次循环所消耗的时间
  currentInterval = interval - offset 
  console.log('时：'+h, '分：'+m, '毫秒：'+s, '秒向上取整：'+sCeil, '代码执行时间：'+offset, '下次循环间隔'+currentInterval) 
  setTimeout(loop, currentInterval)
}
setTimeout(loop, currentInterval)
复制代码