2023届秋招前端面经汇总:包含快手、字节、华为、荣耀、猿辅导等共二十余场面试

1,833 阅读14分钟

秋招总结

包含提前批在内一共投了 72 个简历,共参加 28 场笔试,共进面 10 家。技术面排序被挂两家,其余都走到 hr 面或者主管面。

从七月初辞了实习开始准备秋招到八月九月一堆笔面到国庆后两个还不错的意向。现在把流程中的面完,再有新面试应该都会拒掉不想占坑位。秋招至此完结!

截至 10.27 进度:

  • 已意向:快手、猿辅导、同花顺、途虎养车
  • 泡池子:酷家乐
  • 主管面挂:华为、荣耀
  • 一面挂:字节、蚂蚁
  • 拒面:深信服、cvte

面经汇总

简历基本情况参考:杭州双非本非科班 + 体面厂实习一段 + 技术栈专精 vue

快手

一面:

70 min

  • 项目难点,解决方法

  • 介绍一下响应式原理

    • vue2、vue3 讲区别(dep -> watcher -> dep/watcher 被一个 weakMap 和 effect 取代)
    • Proxy 有什么好用的地方
  • 说一下 vue compiler 的流程

    • 正则、有限状态机、ast -> jsast -> generate -> render
  • 平时怎么学的 js

  • 手撕:怎么判断对象的循环引用问题

     const obj = {}
     const obj1 = {}
     obj.a = obj
     obj.b = obj
     obj.c = obj1
     obj.d = obj1
    
  • 宏任务微任务讲讲

    • 事件循环
  • typeof typeof typeof [] 输出什么

  • 看代码讲输出:异步相关

  • map 和 weakMap,map 和 object 的区别

    • object 的 key 是对象会发生什么
  • 场景:怎么获取页面的帧数

    • 讲了一下页面渲染时机和事件循环的关系
    • (寄,说成了setTimeout,该用 requestAnimationFrame 的)
  • 场景:发红包策略

  • 看代码讲输出:预编译相关

  • 手撕:数组数据 -> 树结构 (时间不够,只讲了思路)

  • 手撕:函数柯里化,每个输出的实例之间要独立

  • 反问

二面:

90min

  • 自我介绍

  • 看代码说输出

     var x = {x: x}
     console.log(x.x)
     //
     let y = {y: y}
     console.log(y.y)
     //
     let z = {}
     z.z = z
     console.log(z)
     console.log(z === z.z)
    
  • css:写个名片

    • 使用的图片比例格式问题
    • 字符多行溢出问题,实现单词整体换行
  • 算出当前页面所有的标签

  • c 语言的指针和 js 的引用类型有什么区别

  • js 的字符串和强类型语言的字符串分别是存在计算机的什么地方

  • 场景:封装一个请求库(纠缠了40min): 支持一次请求多次响应多次请求一次响应,先定义业务模块接口,再思考如何基于浏览器提供的api去实现

  • 反问

感觉寄了,场景题没答好

三面:

35min

面试官好像是部门老大

  • 自我介绍
  • 怎么不读研
  • 介绍学习路线和选择前端的原因
  • 为什么不在之前实习的公司多待一段时间
  • 给一个产品,让我自己用用看,问使用体验和找点bug
  • 反问 + 闲聊

hr面:

30min

  • 自我介绍

  • 为什么不考研

  • 投了哪些公司

  • 现在手上有几个 offer

  • 对快手的意向度怎么样

  • 什么时候能来实习

  • 你选择公司考虑最多的三个元素

  • 怎么不考公

  • 怎么会考虑从自动化转码

    • 自动化本科阶段的学习路线是怎么样的
  • 前端学习路线,你的几个学习阶段

  • 那么多方向,为什么要选择前端

  • 实习期间都做了什么

  • 实习时间怎么那么短

    • 那么早走,领导有意见吗
  • 三个词总结一下自己

  • 反问

小结:

前两面面完都觉得自己要挂了,最后居然苟到了意向

猿辅导

一面:

40min

  • 自我介绍

  • 问项目

    • 口述防抖节流实现
  • https 握手流程(提到了 TCP)

  • TCP 可靠传输的保证

  • 描述事件循环

    • 宏任务微任务有哪些
  • Promise.all

    • 怎么用,返回的数据顺序按什么排列
    • 手写
  • 算法:二叉树深度

  • 算法:判断满二叉树

  • 反问

二面:

点名表扬这个面试官,秋招体验最好的一次面试

50min

  • 自我介绍

  • exportexport default 的区别

  • 讲一下箭头函数的作用域

  • 问了几个 this 相关的

  • 事件捕获和事件冒泡

    • 历史,二者关系,执行顺序,addEventListener 传参控制
  • 手撕:写个深拷贝

  • 手撕:乱序数组比较是否相等

    • 说一下复杂度
  • 算法:最大的连续子序列和

    • 最大的连续子序列
  • 闲聊 + 反问

三面:

50min

  • 自我介绍

  • 项目难点

  • 浏览器缓存

    • 命中强缓存是什么状态码
    • 如果有两个独立的系统有数据依赖关系,怎么确保每次请求都能知道数据是否变化,用哪种缓存
  • 页面渲染过程(dom css树,渲染树,分层,绘制,栅格化,生成位图,GPU加速)

    • 渲染的过程中有哪些线程(只了解合成线程
    • GPU 的工作原理(讲了一下CPU和GPU的区别,逻辑处理,计算并发的优势
    • CPU 缓存了解吗(不了解)
  • async 和 defer 的区别

    • 会用在哪些场景
  • 讲一下单元测试的思想

  • 限制代码规范的方式(eslint,codereview)

    • codereview 这个比较主观,还有其他的吗(不了解
  • 算法:在单调递增序列中(可能有相同数字)找到与目标值所有最相近的数值的索引,要求时间复杂度最优

  • 反问

小结:

无hr面,直接oc。面试官都很不错,oc完两个小时就光速发了意向

字节

一面:

55min

  • 自我介绍

  • 项目

    • elementui 的样式复写怎么弄的(vue 的 /deep/ 样式穿透)

      • 知道怎么实现的吗
    • vue-draggable 怎么实现了解吗

    • vue-lazyload 原理了解吗

      • 触发了什么事件呢
  • 讲讲 TCP 的拥塞控制

  • 讲一下js的异步发展史(使用xhr的事件回调 -> Promise A+ -> Promise -> async / await)

  • Promise A+怎么实现的,你说的 queueMircotask 我不太了解,你说说怎么用

  • 讲一下 Promise 的基本原理

  • vue 的响应式原理

  • 讲一下 defineProperty 和 Proxy 的区别 (监听数组问题,省掉了一堆 dep 和 observer 的性能问题,Proxy 和 Reflect 结合使用的 receiver 的好处

  • 知道 vuex 是怎么实现的吗?

  • 聊一下 webpack 和 babel

  • let、const 通过 babel 怎么转成 var 的

  • eslint 和 jest 说一下

  • 算法:手写个 LRU 缓存,编测试用例

  • 反问

小结:

感觉聊的还不错,面试官的反馈也不错,被挂了,没办法

cvte

一面:

55min

  • 自我介绍

  • 项目

    • 实习的公司为什么用 vue,不用 react
    • 什么场景用 vuex
    • 多语言的场景下,怎么保证页面不变形,比如阿拉伯语言就特别长
  • 注册和登录时候对用户信息要做什么处理

  • 讲一下 https 保证安全传输的原理

  • 知道https怎么抓包吗(不知道..

  • 用户如果遇到白屏的情况,这个要怎么排查问题

  • tokens 存在 localstorage 和 cookie 里面的优缺点,用哪个比较好

  • 算法:存在多个任务,每个都有一个消耗的时间,可能有依赖项。计算全部任务执行完毕的最短用时(构建n叉树 + 求最大路径和

    • 循环引用问题要怎么解决呢?:两分钟后(时间不太够,你回去想想吧)
     const taskQueue = [
       {
         id: 1,
         time: 10,
         parent: 0,
       },
       {
         id: 2,
         time: 10,
         parent: 0,
       },
       {
         id: 3,
         time: 10,
         parent: 1,
       },
       {
         id: 4,
         time: 20,
         parent: 1,
       },
     ];
    
  • 有关注前端现在的发展吗,平时怎么学这些知识的

  • 反问

小结:

约二面的时候进官网晚了点就全约满了,到现在 hr 还没联系

荣耀

一面:

25min

  • 自我介绍

  • 介绍项目

    • 防抖怎么实现的
    • vue-lazyload 原理
    • 路由懒加载原理
  • vue 中 key 的作用 -> diff 算法

  • vuex 里面 mutation 和 action 的区别和用途

  • vue 样式里面 scoped 的作用和原理

    • 样式穿透原理
      • 组件的属性选择器哈希值是怎么确定的
  • 知道哪些 Promise 的方法(all,allSettled,any,race)

    • all 和 allSettled 的区别
    • any 和 race 有什么应用场景
  • 场景:封装一个可以处理请求超时的函数

  • 反问

二面:

20min

非技术

  • 自我介绍
  • 项目介绍
  • 自己的性格特点
  • 有什么兴趣爱好
  • 自己最大的缺点
  • 大学时期感触最深的经历
  • 为什么不考研
  • 为什么选择荣耀
  • 如果你挑选一个手机,首先会考虑什么
  • 你会怎么快速融入一个新环境
  • 对于加班文化的看法
  • 给自己打分会打几分
  • 反问

小结:

二面完半小时还是面试流程中,应该没了。光普通聊天把人聊没了,确实有点不爽

途虎养车

一面:

28min

  • 自我介绍

  • 算法:找出字符串中出现频率最高的字符

  • 讲一下 vue compiler 的流程

  • diff 算法是怎么执行的

    • 双端diff 和 快速diff的区别
  • webpack 的对于文件的依赖关系是怎么处理的

  • 讲一下 js 的继承

  • 知道 babel 的编译过程吗

    • let 模拟 var(作用域相关)
  • 平时怎么学前端的

  • 代码规范问题要怎么做(eslint 、codereview

  • 反问

30min

二面:

  • 自我介绍

  • 了解什么数据结构

  • 算法:两两交换链表节点

  • 你熟悉哪些技术栈

  • 箭头函数和普通函数有什么区别

  • setTimeout 和 Promise 的区别(提到了事件循环

  • 事件循环

    • 页面渲染时机问题
    • 16ms 是怎么来的
  • es5 的继承和 class 的 extend 有什么区别

  • 事件代理是什么

    • 事件代理和事件委托的区别
  • 反问

hr面:

  • 自我介绍
  • 当时高考怎么选的专业
  • 怎么会想转码,你的心路历程
  • 转码之后你做了什么事情
  • 为什么不考虑后端、测试这一块
  • 为什么不考虑考研考公
  • 看你做事情很有目的性,你对技术这块有热情吗
  • 现在手上有offer吗
  • 期望薪资怎么样
  • 反问

小结:

约技术面的时候就有点乱,国庆前说要约 hr 面,节后好几天才发了约面邮件

同花顺

一面:

30min

  • 自我介绍

  • 介绍项目

  • 你看源码的时候是怎么调试的

  • 防抖节流的使用场景

    • 搜索框即时显示使用的是防抖还是节流
  • 讲一下图片懒加载原理

    • 会不会产生回流重绘
    • 还有其他方式吗,除了监听 offsetTop
  • 上传图片是哪个 content-type

  • 遍历对象的方式

    • 对象里面的数据有序吗
    • 怎么实现有序(加个数组做索引,用Map)
  • map 和 weakMap 的区别

  • 场景:带有效时间的简单 localStorage 方法,支持设置过期时间

  • 接受实习吗?(校招后提前来实习)

  • 反问

二面:

28min

  • 自我介绍

  • 链表、数组、集合的区别

  • 了解哪些 HTML5的新特性(draggable 、historyAPI

  • 输入 url 到页面渲染

  • http2.0 新特性

  • 进程和线程有什么区别

    • js 是单线程吗
    • 怎么实现把次要的程序放到其它线程
    • 了解 WebWorkers 吗(不了解
  • 首屏优化可以怎么做

  • 手上有哪些 offer

  • 哪里人,意向城市是哪里

  • 期望薪资多少,如果后续有多个offer,会怎么选择

  • 如何看待加班和 996

  • 平时怎么学的技术,后续有什么规划

  • 能不能提前来实习

  • 反问

hr面:

35min

  • 闲聊

  • 不考研吗?

  • 选择工作的因素

    • 你理解的平台是什么样的
  • 平时刷题吗,力扣差不多多少题了

  • 前端学习路线

  • 为什么选择前端,不选后端测试

  • 如何看待现在越来越卷的互联网环境

  • 意向城市

  • 期望薪资

  • 除了学习和上课,在学校还有做过其它事情吗

  • 最不喜欢跟什么样的人工作

  • 用几个词评价一下自己

  • 大四的规划

  • 接受出差吗(因为是国际化部门)

  • 反问

小结:

面试体验还行,问的问题没有区分度

酷家乐

一面:

45min

  • 算法:比较二叉树

  • 手撕:解析url参数(中文乱码解析问题 decodeURIcomponent

  • get 、post 的区别

  • https 的加密原理

  • cros 的几种方案

    • 简单请求和非简单请求
  • 事件循环

    • 宏任务微任务区别的必要性
  • 简历上写了 es262,说一下你最熟悉的那个内容(谈这个我可就不困了奥

  • 反问

二面:

35min

  • 自我介绍

  • 会不会 react 和 ts(专精 vue,ts 看得懂,不会类型体操

  • 了解 es 哪些新特性

  • 手画一下原型链的关系图

  • 手写 new

  • get 、post 的区别(怎么又问一次

  • 浏览器渲染流程,从获取到静态数据开始讲

  • 性能优化有哪些方式(async defer -> 缓存 -> 懒加载

  • 图片懒加载原理

    • 频繁滚动页面的话一直触发事件怎么办
  • webpack 的工作原理

  • 浏览器存储方式及区别

  • 算法:括号匹配变种

  • 场景:已知无序数组中的一个元素下标,使用时间复杂度为 O(1) 的方式把它删掉(脑子短路白给了...

  • 反问

三面:

50min

  • 自我介绍

  • 智商题:一个金条,可以切两次;有个工人,工作七天,每天都要发七分之一金条,怎么发(4 + 2 + 1

  • 智商题:八个球,找出最重的球的最少次数(6 + 2

  • 智商题:四瓶药丸,有一瓶的所有药丸都比其它瓶子里的重,一次找出最重的那瓶(不会

  • 算法:已知层序遍历顺序,构建二叉树(见过但是没写...现场推了一遍,没有直接秒掉)

    • 判断是否为二叉搜索树
  • 平时怎么学的前端

  • 看你有写博客,讲一下你理解最深的内容

  • 你本科自动化的,这主要学的是什么

  • 英语水平怎么样

  • 应届工作你最看重哪一点

  • 反问

二面说三面是聊天.....上当了。给钱不多还问智商题,油饼

小结:

二面是线下,一面三面是线上,不太理解

蚂蚁

一面:

33min (电话面)

  • 自我介绍

  • 介绍项目,项目难点

    • 优化的点在哪里
    • 哪种路由方式
  • vuex 的使用场景

  • data 为什么是个函数

  • vue2 vue3 的区别,vue3 的优化点在哪

  • 懒加载原理

    • 监听了什么事件或者属性
  • 宏任务微任务区别,事件循环

  • 你的前端学习路线

  • 看你提到了闭包,讲一下你对闭包的理解

    • 你在实践中有用什么闭包吗(箭头函数里面用 this 会触发闭包

      • 箭头函数和普通函数的区别
  • 闲聊实习时候做的事情

无反问环节

小结:

感觉一面自己答得很无懈可击了,挂了认命

华为云

一面:

30min

(面试官好像不是做前端的)

  • 自我介绍

  • 做了什么项目

  • 单元测试你是怎么做的,代码规范怎么学的

  • 前端性能优化相关

  • 算法:最长非重复字串长度

    • 再编几个测试样例
  • 未来几年的规划

  • 闲聊:技术栈是 react 和 angular

  • 反问

二面:

40min

(也不是前端)

  • 自我介绍

  • 项目相关

  • 上传图片要注意什么(编码,加密,分片,请求方式

  • storage,cookie,session,tokens

  • xss 和 csrf 了解多少

  • 管理员鉴权怎么做

  • 算法:

     // 输入一个起始值和结束值,数字只有一位小数,请写一段程序将起始值和结束值按1进行拆分,要求:起始和结束值,不足1的按照实际值输出,超过1的先按照1输出后,在按照实际值输出。
     //例子:0.3 3.4
     // 输出:0.3 1, 1 2, 2 3, 3 3.4
    
  • 反问

三面:

20min

  • 自我介绍

  • 在公司做了什么项目

    • 怎么跟其他人协作的
  • 是否认可华为文化

  • 为什么选择前端

  • 个人未来的规划

  • 大学期间做的最成功的事情是什么

    • 最失败的事情是什么
  • 除了学习,有没有参加什么社会活动

  • 相对于科班来说,你有什么优势

  • 还投了哪些方向的公司

无反问

小结:

技术面问的很简单没有区分度,主管面聊天被挂,进池子的机会都没有,跟荣耀一模一样。技术面的时候问的有多水,就多没希望进池子或者被捞。