字节阿里前端面经2022年2月

8,148 阅读12分钟

字节-商业化核心团队

技术一面

  • 3分钟自我介绍
  • 讲一下你简历上的项目经历
  • promise代码题说一下输出顺序
const p = new Promise(resolve => {
    console.log(0)
    resolve()
  })
p.then(res => {
  console.log(1)
}).then(res => {
  console.log(2)
}).then(res => {
  console.log(3)
})
p.then(res => {
  console.log(4)
})
p.then(res => {
  console.log(5)
})
p.then(res => {
  console.log(6)
})
async function async1 () {
  console.log('async1 start')
  await async2();
  console.log('async1 end')
}
async function async2 () {
  console.log('async2')
}
console.log('script start')
setTimeout(function () {
  console.log('setTimeout')
}, 0)
async1();
new Promise (function (resolve) {
  console.log('promise1')
  resolve();
}).then (function () {
  console.log('promise2')
})
console.log('script end')
async function async1() {
    console.log('async1 start');
    await async2();
    console.log('async1 end');
}
async function async2() {
    console.log('async2 start');
    return new Promise((resolve, reject) => {
        reject();
        console.log('async2 promise');
    })
}
 
console.log('illegalscript start');
 
setTimeout(function () {
    console.log('setTimeout');
}, 0);
 
async1();
 
new Promise(function (resolve) {
    console.log('promise1');
    resolve();
}).then(function () {
    console.log('promise2');
}).then(function () {
    console.log('promise3');
});
console.log('illegalscript end');
  • display有那些值
  • display和visibility区别
  • div里面放img,div设置display:none和visibility:hidden对img的src加载有什么影响?
  • vue2/3数据劫持对比
  • vue keep-alive原理及属性,include和exclude都写了同一个路由会怎样?
  • 手写 eventEmitter
  • 一段vuex action代码现场code review(try-catch、默认返回值、promise)
  • 手写柯里化
  • letcode 22 括号生成
  • 你有什么问我的

复盘

  • 第一次面字节,内心慌的一批,发挥很差劲,而且明显准备不足
  • 手写 eventEmitter其实就是vue2的事件机制,我明明会但是没反应过来。
  • 柯里化没写出来我心态崩了,导致最后面试官问我有什么问他的,我意识模糊说没有。
  • 他说5年经验的前端不应该没有问题,然后我就说我是内推的跟朋友了解过了部门情况,不该提这个的,很尴尬,回答不好。`
  • 你有什么问我的?一面建议问题:1.团队规模怎么样?2.主要使用什么技术栈?3.主要业务是那些?

技术二面

  • 3分钟自我介绍
  • 讲一下你简历上的项目经历
  • 异步加法
// 异步加法
function asyncAdd(a,b,cb){
  setTimeout(()=>{
    cb(null,a+b)
  },Math.random()*1000)
}
async function total(){
  const res1=await sum(1,2,3,4,5,6,4)
  const res2=await sum(1,2,3,4,5,6,4)
  return [res1,res2]
}
total()
// 实现下sum函数。注意不能使用加法,在sum中借助asyncAdd完成加法。尽可能的优化这个方法的时间。
function sum(){

}
  • 你有什么问我的

复盘

  • 面试官深入每个项目试图找到技术难点和复杂度来判定我的技术深度,但是我写的项目都是不到一年的新项目而且没有难点,当他发现我的业务太简单略有失望。
  • 异步加法一开始根本没看懂题就直接写起来了,导致改了3版才写出来,没时间优化了就讲了下优化思路:1.两两相加节约时间(二分查找的思路)。2.缓存计算结果节约时间。总的来说有点拉胯了。
  • 自己的优势没有发挥出来,自己的弱势又暴露了。凉凉
  • 你有什么问我的?二面建议问题:1.您对面试者有那些期待?2.业务的未来发展方向是什么?3.您觉得我这次面试过程中有哪些可以改进的地方?

字节-抖音

技术一面

  • 3分钟自我介绍
  • 讲一下你简历上的项目经历
  • vue2响应式原理
  • vue3有哪些优化
  • vue3 composition api解决了什么问题?
  • react fiber原理
  • 浏览器事件机制, e.target和e.currentTarget区别,addEventListener第3个参数
  • 浏览器事件循环
  • 浏览器缓存
  • 性能优化方案
  • background-size: cover和contain区别
  • letcode 199. 二叉树的右视图

复盘

  • 问题都比较常见,难度适中吧

技术二面

  • 3分钟自我介绍
  • 讲一下你简历上的项目经历
  • 猴子吃香蕉,每个猴子的食量为[4,2,1,5,7,3,1]。猴子贪心,最多可以吃自己食量的两倍,但是不能超过当前剩余香蕉数量的一半。求最少多少个香蕉可以满足猴子?
  • 用react实现个菜单组件,要求无限嵌套,可点击展开收缩,点击时自己和所有父菜单高亮
  • 你有什么问我的

复盘

  • 猴子吃香蕉是动态规划题,试着从后往前求值
  • react实现个菜单组件很简单,但是你试试用纯文本编辑器写看看什么滋味

大复盘

  • 2次都倒在2面了,找hr要了下面评,面评并没有说哪方便很差,只是没有看到技术深度。我开始思考哪里出问题了。是我的能力不足?还是我不适合字节?还是其他的原因?
  • 最后我总结出:1.我明明准备了非常久,我的能力是足够的不应该自我怀疑。2.我的项目比较简单,不能佐证出我的技术深度。3.我的个人优势没有在面试中表现出来,全程跟着面试官的节奏走了,而不是按我的节奏走。4.算法题还是有点慌,没有冷静读题就动手了导致返工,表现不好,以后一定要谋定后动,先确定解题思路没问题再动手。

阿里-天猫某业务线

技术一面

  • vue 组件传参有那些方式
  • vue watcher怎么实现的
  • vue 自定义watch的3个属性
  • vue nextTick 延伸到宏任务微任务
  • vue2/3对比
  • vue3 composition api解决的问题
  • vue3 composition api对比 react hooks
  • 介绍下vuex的使用
  • 介绍下vue-router
  • 手写节流防抖
  • 手写hashTable
  • 手写一个adapter
  • 你有什么问我的

复盘

  • 哇,这个面试官问的全是我会的我精通的,他真是太懂我了!
  • hash算法一时之间还真写不出来,然后我就跟他讲了hashTable的数据结构。散列函数+链表
  • 手写一个adapter他举得场景我下意识的回答了switch-case就可以解决啊。但事实上应该是写出设计模式里面的适配器模式。难受,这个我明明会的,一时之间大脑没转过来。

技术二面

  • 自我介绍
  • 三个项目展开讲讲
  • 自研项目怎么衡量结果?有没有数据?有思考过其他衡量结果的方法吗?推广中有什么难点?怎么解决的?

复盘

  • 我跟这个面试官讲了非常多的方法论层面的东西,以及我自己的架构自研思考和思维模式
  • 这个面试官在我每次回答完之后会沉默10s-15s,让我有点压力
  • 最后我问面试官对我说的这些方法论和思维模式怎么看?他说很好,他很欣赏,但是要灵活运用balabala。我知道,我过了,而且很适合。
  • 我也明白了为什么他前面老是沉默10s-15s,他在思考我的回答
  • 总的来说感觉我们有共鸣,在他这里我有认同感和归属感

技术三面+hr一起

  • 技术
  • 自我介绍
  • 过去3家公司工作经历?为什么去?为什么离开?
  • 在每家公司遇到的最大的挑战是什么?
  • 介绍下你的3个项目经历?
  • hr
  • 用3个词形容你自己
  • 你最大的缺点是什么
  • 为什么离开公司
  • 你在微医最大的收获是什么
  • 新的工作你最看重什么
  • 你未来的发展规划
  • 目前的薪资
  • 期望薪资
  • 你有什么问我的?

复盘

  • 由于我的网络非常差劲,导致我频繁的让面试官重复他的问题,他很有耐心,但是网络问题对我的心态产生了很大影响,导致我只是回答了问题,而没有展开讲讲
  • hr的网络也不好,后面我们换成了钉钉群语音
  • 我在自我介绍里挖了很多坑,等着面试官深挖,但是他不按套路出牌是我没有想到的,导致我的节奏乱了
  • 我过于强调业务思考思维,给面试官留下了不好的印象:“你从推崇技术的极端走到了推崇业务的极端,但是他们是相辅相成的。”我没有走极端,只是着重的强调了业务,但是对方接受的信息跟我表达有误差,感觉是我的表达有问题。
  • 总之,感觉我3面要挂了,太拉胯。hr的问题回答的还行

结果

  • 过了一周阿里hr给我发了offer,说真的,我感觉是一面和二面面试官强行把我捞起来的。因为我感觉我3面真的太拉胯了。当然,这也导致最后的offer不太符合预期。

大复盘

  • 阿里 行为面试法
  • 字节算法部分其实没那么难,把letcode热题100的简单和中等刷完就可以了,不需要刷困难题。多总结解题思路,回溯、动规、二叉树、递归是重点。
  • 自己的项目经历通过STAR来讲述,注意突出项目技术难点、你是怎么思考解决的、取得的结果能不能数据化?行业有没有更好的解决方案、有没有沉淀技术方案分享的习惯

其他同学的2022年2月份面试真题

极氪、光云、网易、BOSS直聘、施强、行云、讯盟、作业帮、PDD、政采云、微策略、E签宝、zoom、携程、税友、爱逛、小红书、pingpong

  • 原型链
  • 闭包
  • 可执行上下文
  • promise实现
  • new 的过程
  • eventloop 浏览器、 eventloop node
  • 一个url输入后发生了什么
  • vue双向数据绑定
  • vue23 diff
  • 0.1+0.2为什么不等于0.3
  • 前端性能优化方案
  • call、apply、bind区别,bind再bind this指向谁
  • 柯里化和偏函数的区别
  • 判断数据类型的方法
  • 往数组头部添加元素的方法
  • instanceof原理
  • let变量提升暂时性死区
  • 节流/防抖的区别
  • 浏览器渲染机制
  • 浏览器跨域方案
  • 浏览器同源策略
  • 浏览器缓存机制
  • 常见网站攻防
  • 虚拟dom和真实dom性能和效率
  • new Vue做了什么(口喷 _init()函数 )
  • 双向绑定(vue2/vue3)
  • 手写深克隆
  • promise原理
  • vue3与vue2的区别
  • react this.setState useState区别
  • react.memo 和 pureComonent区别
  • useState如何更新拿到最新值
  • useMomo 和 useCallback区别
  • useEffect第二个参数?对应class哪些生命周期?
  • webpack优化配置
  • webpack hash chunkhash contenthash
  • babel执行原理
  • 为什么vite比webpack快
  • webpack Tapable发布订阅原理
  • webpack编译流程
  • typescript type interface区别
  • typescript ReadOnly实现
  • js大文件上传解决方案
  • 移动端轮播方案
  • 长列表滚动加载优化
  • margin塌陷如何作用到横向
  • leetcode 20 和 165
  • 取min~max随机整数 手写
  • let怎么支持的块级作用域
  • leetcode 17
  • vue $nextTick原理
  • vue 侦听变化的策略(push + pull) 精细化渲染
  • react useEffect替代了哪几个生命周期
  • reducer(直接说reducer怎么实现回溯的 就不往下问了)
  • 类组件和函数式组件的区别
  • useCallback和useMemo区别
  • useEffect参数的区别
  • vue 生命周期 & 父子组件生命周期...(都2022了)
  • 手写二叉搜索树
  • 手写翻转列表
  • 为什么null的typeof 是object呢
  • object和map的区别
  • object的快慢属性
  • object key 字符串和number的顺序
  • V8 垃圾回收,什么场景会一直进入新生代但是没进入老生代
  • 假如点击事件,弹出不同域名url(跨域),但是要拼上不可重复的自增数如何实现
  • 12个瓶子 有一个不一样重 用三次天平 查出来(PDD的这道题感觉是搞心态的)
  • 实现一个组件 给时间 回调 format 一秒render一下 按照format 到时间了执行callback
  • redux原理 pureComponent原理
  • transform translate transition 区别
  • bigint Polyfill(大数相加?)
  • 手写获取cookie(脑子一热写成navigator.cookie 尬住 正则写不出)
  • 项目怎么推进,落地过程里遇到了什么事,「一个项目 投入了大精力 反馈不好 你不难受吗」
  • 一个架构 run起来才是有价值的
  • for of for in区别
  • 如何让一个对象 既不能修改属性 也不能添加属性
  • 多个请求并发要怎么做
  • class 和 es5 function 区别
  • 回文字符串最大子串
  • vue2的computed和vue3的watcheffect有没有类似 扣源码
  • vue3收集依赖方式
  • 手写 观察者模式和发布订阅模式 有什么区别(eventbus就是发布订阅吧)
  • webpack打包中间状态是什么样的 在转化为目标规范之前
  • ts any unknow never区别
  • 进程 线程 协程关系
  • vue的complier产生了啥
  • 如何向小白介绍vue组件export的东西
  • 后端给你一个10M的数据对象 你怎么优化处理放到vue data里
  • 谈谈你对前端工程化的理解
  • 一个10M的string是放在堆里还是栈里?为什么?

总结

  • 都2022年了,大厂和中厂还是会问很多八股文和基础问题
  • 手写柯里化、节流、防抖、eventEmitter等基础算法还是高频题
  • vue react框架api及源码原理都是热门题
  • webpack rollup vite打包工具原理、过程、优劣也是跑不掉的
  • 所以不要觉得P6+ P7就不问八股文,不存在的,还是要卷!!!

避坑

  • BOSS直聘杭州这边疯狂暗示面试者加班
  • 最近杭州疯狂裁员的公司最好都不要去
  • 有些公司的offer是70%月薪+30%绩效的,但是在法律层面30%绩效公司经营不善的时候不给也是合法的
  • 规模太小的公司就算年终奖很高也要慎重,因为小公司抗风险能力太差了

后续

今天先写这么多,下面几篇讲讲技术深度和广度、业务思维、方法论、管理经验、开源经验等等。有兴趣的小伙伴别忘记对我素质三连,点赞、关注、评论

letcode 字节高频算法题JS解法集锦