看看热乎的前端面经（中大厂会问什么）

已注销
269 阅读4分钟

看看热乎的前端面经（中大厂会问什么）

换工作前想清楚跳槽目标

Tips：这个也挺重要的，投递的时候看好业务、部门；公司一般都只能在一个流程里面，结束流程才能面其他的部门，且都是有面评的，最好是一次性选择好面完

  • 公司：中大厂
  • 业务：感兴趣
  • 团队：前端团队，技术氛围不错
  • 个人：有机会独立负责一些大事情

热乎的面试经验

小鹅通

一面

  1. 做过哪些性能优化
  2. webpack渐进式
  • webpack常见配置参数是什么？
  • 常用的loader有哪些？
  • 有没有自己写过一个plugin，暴露的生命周期有哪些清楚嘛
  • webpack的原理，从执行到结束的过程
  1. babel实现原理是什么
  2. 手写可以缓存的接口封装
// 考察Map用法
function httpRequest(url, options) {
  return Promise((resolve, reject) => {});
}

const reqMap = new Map();
const waitTime = 1000;

function request(url, options) {
  if (reqMap.has(url)) {
    const req = reqMap.get(url);
    if (Date.now() - req.time < waitTime) {
      return reqMap.get(url).response;
    }
  } else {
    const res = {
      response: httpRequest(url, options),
      time: Date.now(),
    };
    reqMap.set(url, res);
  }
}
  1. map数据结构怎么用，为什么可以用非字符串作为key值
  2. 手动实现一个模版字符串
// replace不会改变原字符串
// 正则表达式：. 匹配除换行符 \n 之外的任何单字符；* 匹配前面的子表达式零次或多次； ? 匹配前面的子表达式零次或一次，或指明一个非贪婪限定符
function template(str, context) {
  return str.replace(/${(.*?)}/g, (match, key) => {
    return context[key]
  });
}
  1. 从设计理念上说一下Vue VS React
  2. 小程序了解的多嘛
  3. 前端职业规划
  4. 你对前端的看法

二面

未参加

网易云音乐

一面

  1. 以下是否有语法错误，输出结果是什么
const arr = [1,2,3,4,5] // 无语法错误
const arr1 = arr.push(6) // 6
  1. 在react constrictor里面写settimeout，this指向什么
  2. 如何自己设计一个image，实现懒加载的组件
  3. 如何实现页面缓存，keep-live实现原理，对应的react如何实现
  4. 做过哪些首屏优化
  5. 以下能看到页面变化嘛
document.body.style = 'background: red' 
document.body.style = 'background: black'

二面

  1. 工作中遇到过什么技术难题解决不了
  2. 说一下react跟vue的区别
  3. 做过什么性能优化
  4. 找出出现次数最多的字符串
const getMostStr = (arr) => {
    let obj = {}
    let mostObj = {
        str: '',
        count: 0
    }
    for (let i = 0; i < arr.length; i++) {
        if (obj[arr[i]]) {
            obj[arr[i]]++
        } else {
            obj[arr[i]] = 1
        }
        if (mostObj.count < obj[arr[i]]) {
            mostObj.count = obj[arr[i]]
            mostObj.str = arr[i]
        }
    }
    return mostObj.str
}
  1. 实现'get-element-by-id' -> 'getElementById‘
const transStr = (str) => {
    const arr = str.split("-")
    let res = arr[0]
    for(let i = 1; i < arr.length; i++){
        res += arr[i].slice(0,1).toUpperCase() + arr[i].slice(1)
    }
    return res
}

字节

一面

根据简历问项目

二面 抖音架构组

  • 根据简历问项目，主要针对以下聊

    • 多工程公共模块处理方式 

      • 多版本怎么管理
      • 私有化怎么更新

    • lint规范怎么做的 

      • 团队怎么落地的
      • 如何衡量lint对代码规范的效果，比如说规范了百分之多少的代码（可以用 CI、CD这种，我没有想到）
      • 目前这个规范还有什么可以改进的嘛

  • 算法：实现一个调度器

  • 算法：JSON转JSX

三面 抖音直播组

根据简历问

  1. 组件库 [Taro多端组件库的设计与实现]

    • 介绍一个你觉得最难的组件，如何设计并实现的（由于这块没有总结过，回答的明显有点磕巴，面试官根据组件延伸了也不少问题）

      • dropItemMenu，想实现一个用户点击非浮层区域也能关闭，怎么实现

    • 你在组件库承担的什么角色

  2. 移动端比较熟悉嘛

  3. webpack性能优化

  4. tree shaking原理

  5. external与dll区别

  6. 没有问算法了

HR

  1. 没有让自我介绍，问对面试流程体验怎么样
  2. 跳槽你会考虑哪些
  3. 那现在你面试的字节的这个岗位符合你的预期嘛
  4. 你是怎么判断出符合的
  5. 看你不是计算机专业为什么做前端
  6. 为什么做前端而不是后端啥的
  7. 绩效怎么样

海云前端 提供前端简历面试辅导、前端项目难点笔记、前端咨询

avatar
文章
阅读
粉丝