内容简介:离职原因看我这篇文章吧:我目前面了五家公司:滴滴、蚂蚁、拼多多、酷家乐、字节跳动,拼多多和酷家乐基本已拿到 offer,蚂蚁二面完了,滴滴和字节即将三面,我先把我已经面过的面经先总结出来,其他的不管过没过,这周内我都会总结出来,希望能给到正在找工作同学的帮助。在文章里我不仅会列出面试题,还会给到一些答题建议,个人能力有限,也不能保证我回答都正确,
前言
离职原因看我这篇文章吧: 离开蘑菇街后,我最近的一些想法 ,然后不得不去找工作恰饭呀。
我目前面了五家公司:滴滴、蚂蚁、拼多多、酷家乐、字节跳动,拼多多和酷家乐基本已拿到 offer,蚂蚁二面完了,滴滴和字节即将三面,我先把我已经面过的面经先总结出来,其他的不管过没过,这周内我都会总结出来,希望能给到正在找工作同学的帮助。
在文章里我不仅会列出面试题,还会给到一些答题建议,个人能力有限,也不能保证我回答都正确, 如果有错误,希望能纠正我。
酷家乐
酷家乐是我最早面的一家公司,还没被裁的那周二刚好面完,结果周五就被裁了,可能这就是冥冥之中吧。
面试的部门是 工具 组,是酷家乐最核心的部门,四面面试官跟我说我面的组是工具团队中的最核心组,会涉及到一些图像相关的技术,比如 Tree.js、WebGL等,所以这个组其实也挺好的,感觉能学到不少技术。
一面(电话面)
- 你在项目如何优化的
我在简历里面写到了性能优化相关的,所以这个问题。
- 你做的项目有什么值得说的
基本上就是考察项目的亮点,可以说一些项目难点是如何解决的,或者介绍一些项目中用到的牛逼的技术。
- Ts 有什么优势
讲道理所有现在在网上能查到的优势都是得益于 静态语言 的优势。
- type 和 interface 的区别
这是一个高频题,如果考察 TS,这应该是最容易考察的,网上也都能查到相关的资料,但是很可能忽略一个点: type 只是一个类型别名,并不会产生类型 。所以其实 type 和 interface 其实不是同一个概念,其实他们俩不应该用来比较的,只是有时候用起来看着类似。
- React 事件机制
- 聊聊 React 的 diff
聊 diff 建议先看看我之前写过的一篇关于虚拟 DOM 的文章: 从 React 历史的长河里聊虚拟DOM及其价值 ,有助于理解 diff 的意义。
diff 的细节可以看我之前写的: 详解 React 16 的 Diff 策略
- React 优化
可以看之前我写的 React 函数式组件性能优化指南 ,对于类组件也有对应的 API。
- 怎么理解闭包
基础中的基础,虽然社招考得不多,但是如果连闭包都理解不了,应该会减分不少。闭包由于在规范里没有定义,所以很多人下的定义不一样,理解的角度也不同,但是自己要有一套正确的理解方式,如果按照我的理解 JavaScript 里面所有的函数都是闭包,因为有全局环境,所有的函数都可以访问全局变量。
- 节流怎么实现的
防抖和节流的代码还是需要会手写的,这也是一个闭包的例子,
- 原型,class B 继承 class A 翻译成 es5 应该是什么样子
说实话,我觉得这道题其实蛮有水平的,即考察了如何写出一个好的继承方式,也对 new 过程进行了考察,还对考察了对 Class 的理解。
注意的点: class
是有重载功能的,怎么在子类的构造函数里面调用 super
二面(现场面)
- react 的基本原理
UI = f(state) ,虚拟 DOM、diff 策略、setState
- react 如何做性能优化
这个题也是高频,见一面回答
- redux 的重点概念
store、reduce、action、actionCreater、dispatch
- 聊一聊 React 的生命周期
尽量把 React 15 和 16 的进行对比,然后 16 为什么要准备废除那几个生命周期,以及新增的生命周期可以进行替代。
这个图好好的理解一下
- 聊一聊 hooks 怎么处理生命周期
讲道理函数式组件是没有生命周期的,但是如何去模拟类组件的生命周期的作用,都是在 useEffect
里面进行操作的,因为生命周期里面所做的基本都是副作用,放到 useEffect
里是最合适的,专门用来处理副作用。
- 笔试题一
const a = { b : 3} function foo(obj) { obj.b = 5 return obj } const aa = foo(a) console.log(a.b) console.log(aa.b)
- 笔试题二:
function Ofo() {} function Bick() { this.name = 'mybick' } var myBick = new Ofo() Ofo.prototype = new Bick() var youbick = new Bick() console.log(myBick.name) console.log(youbick.name)
box-sizing
考察递归
- 用 ES5 实现私有变量
考察闭包的使用
三面(现场面)
- 简历里面的性能优化是如何做的
减少请求频率、图片压缩、 React.memo
、 React.useMemo
- class 组件里面如何做性能优化(因为前面我说了用 React.memo 做了性能优化)
shouldComponentUpdate(简称 SCU)。SCU 跟 immutable 强相关,一定要好好理解 react 的 immutable,否则很可能理解不了为什么不能直接去修改 state,然后再去 setState,以及 redux 的 reducer 要返回一个新的对象。
- 实现一个 Typescript 里的 Pick
type Pick<T, K extends keyof T> = { [P in K]: T[P] }
- 手写 Promise.all
- 手写并发只能 10 个
- 算法题,怎么判断单链表相交。
很多种方法,我当时说的是最后一个节点如果相同,那么就代表相交。
- 算法题,怎么找到第一个相交的节点。
同时遍历两个链表到尾部,同时记录两个链表的长度。若两个链表最后的一个节点相同,则两个链表相交。有两个链表的长度后,我们就可以知道哪个链表长,设较长的链表长度为len1,短的链表长度为len2。则先让较长的链表向后移动(len1-len2)个长度。然后开始从当前位置同时遍历两个链表,当遍历到的链表的节点相同时,则这个节点就是第一个相交的节点。
这是我刚想到的一种方式,不过当时面试的时候我记得好像更简单,但是想不起来了。
四面(现场面)
- 你觉得你在公司人缘怎么样
- 你觉得你为你们小组做了什么贡献
- 为什么要离职
- 除了我们公司还投了其他公司吗
- 薪资和层级有什么要求
- 如何垂直水平居中
- 你看过开源库的源码吗?
- 那你聊聊 React 的源码,把你记得起的讲一讲
我看过 React 的一部分源码的,所以关于 React 源码更新部分的东西,应该基本都能说个大概。
- FiberNode 有哪些属性
- stadeNode 有什么用?
- 还有一些技术问题想不起来了
小结
酷家乐面试体验还是不错的,我是一面电话面,面完觉得 OK 之后就叫到公司去现场面试,6 点半下班了就骑车去了酷家乐,七点开始面试,一口气面完了三面,饭都没来得及吃,不过面试官很好给我倒了水。
感觉面试官对我的项目似乎不太敢兴趣,很少问项目的东西,可能由于他们是工具组,连我简历里面组件库相关的也没面,考察基础的比较多,基础考察得比较全面。
但是由于考虑到我之前做的项目复杂性不够,以及工作年限的问题,给到的评级不高,导致薪资也不是特别高,但是已经是这个评级的顶峰了,要是没有更好的 offer 酷家乐还是非常值得去的,特别是工具组。
拼多多
一面
- react 16 生命周期有什么改变
componentWillMount
, componentWillReceiveProps
, componentWillUpdate
准备废除,新增了 static getDerivedStateFromProps
和 getSnapshotBeforeUpdate
我还详细的介绍了为什么要用 getDerivedStateFromProps
来代替即将废除的三个生命周期,主要是16 版本 render 之前的生命周期可能会被多次执行,具体的可看我的这篇文章: Deep In React之浅谈 React Fiber 架构(一)
getDerivedStateFromProps flex: 0 1 auto;
flex 这个属性常考题,好好把阮老师的那篇 flex 语法篇 看完 flex 的面试题基本没问题。
['aaafsd', 'aawwewer', 'aaddfff'] => 'aa'
不能调试,全靠编程素养,只能面试官才能运行。
- interface 和 type 的区别
又考了,上面有回答
- 有用状态管理吗?
我常用的是 redux 和 dva,然后再聊了聊区别已经 redux 的理念
- 有用 ssr 吗?
没用过
- node 熟悉吗?
写得少
二面
- class 组件与函数式组件的区别
生命周期、设计理念,感觉这道题比较开发,可以看看 dan 的这篇: 函数式组件与类组件有何不同?
- css 优先级
important > 内联 > ID选择器 > 类选择器 > 标签选择器
- 避免 css 全局污染。
我常用的 css modules
- css modules 的原理
生成唯一的类名
- 有一个a标签,如何动态的决定他的样式。
我说了先写几个 css,然后外部传一个前缀的方式。面试官问了都要这样吗?我说可以通过 context 的方式,就不需要每个组件都传了。
- import 和 require 导入的区别
高频题,考察 ES6 模块和 CommonJS 模块 的区别。关键点:1. 前者是值的引用,后者是值的拷贝。 2.前者编译时输出接口,后者运行时加载。
推荐文章: 前端模块化:CommonJS,AMD,CMD,ES6
- require 有什么性能问题
好好想想上一个题的区别就能想到了
- 组件库如何做按需加载
我常用的是 babel-plugin-import
- webpack 如何实现动态加载
讲道理 webpack 动态加载就两种方式: import()
和 require.ensure
,不过他们实现原理是相同的。
我觉得这道题的重点在于动态的创建 script 标签,以及通过 jsonp
去请求 chunk ,推荐的文章是: webpack是如何实现动态导入的
- react 里有动态加载的 api 吗?
React.lazy
- React.lazy 的原理是啥?
- webpack 能动态加载 require 引入的模块吗?
应该是不能的,前面说了,webpack 支持动态导入基本上只能用 import()
和 require.ensure
。
- require 引入的模块 webpack 能做 Tree Shaking 吗?
不能,Tree Shaking 需要静态分析,只有 ES6 的模块才支持。
function foo(fn, interval, times) {}
常规题,网上有参考答案的。
三面
- 组件平台有哪些功能?
详细的跟我讨论组件平台的设计,因为他们也想做一个组件平台。
- 实现一个 redux
实现 createStore
的功能,关键点发布订阅的功能,以及取消订阅的功能。
- 用 ts 实现一个 redux
简单的加上类型,我写的类型没有 redux 源码那么复杂,当时写得比较简单。
小节
一面的时候其实我自己感觉答得不是特别好,连 less 的语法都忘记了,当时面下来感觉要凉了,平时写 样式的时间确实太少了。
很幸运的时候还是给我过了,二面面试官我觉得面得很专业,基本都是从浅入深的考察知识的深度,我感觉答得还可以,因为我是属于那种会的就尽量深一点,暂时不用的就很少花时间,所以我目前知识的广度很有欠缺,对于 node、ssr、移动端、小程序这些方面我的能力都很薄弱,但是面试的时候如果你不熟悉,直接说不熟悉就行,他就不会面了。
我准备面试之前对我自己的要求就是,我会的尽量不会很快就被问倒,所以我重点复习了我擅长的知识。
面下来感觉拼多多也没有想象中那么难,虽然拼多多薪资算行业内高的,不过拼多多在上海,我在杭州,另外就是强制上 6 天班,我比较忌惮这点。考虑到我和女朋友本来就是异地,要是单休,而且节假日也会比正常的少,见面的机会就更少了。
反正选 offer 这种事还是尽量综合考虑吧,团队、薪资、个人生活都应该考虑进去。
最后
我是桃翁,一个爱思考的前端er,期待你的关注。
如果你最近也在找工作,欢迎找我交流,下面是我公众号。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
编程珠玑(英文版・第2版)
[美] Jon Bentley / 人民邮电出版社 / 2010-8 / 39.00元
多年以来,当程序员们推选出最心爱的计算机图书时,《编程珠玑》总是位列前列。正如自然界里珍珠出自细沙对牡蛎的磨砺,计算机科学大师Jon Bentley以其独有的洞察力和创造力,从磨砺程序员的实际问题中凝结出一篇篇不朽的编程“珠玑”。这些文章是《ACM通讯》最受欢迎的专栏文章,最终结集为两部书出版。本书为第一卷,主要讨论计算机科学中最本质的问题:如何正确选择和高效地实现算法。 在书中,作者选取许......一起来看看 《编程珠玑(英文版・第2版)》 这本书的介绍吧!