背景
由于所在行业受政策的影响,公司考虑转型,而且为了节省成本,进行了裁员,我不幸在此次的优化名单中。
虽然拿到了裁员的赔偿,在休息几天后,我还是拿起了书本,开始复习找工作。
网上五花八门的面试题很多,大部分都仿佛还是几年的题库。再想想这几年的新技术点,发现自己的知识体系还是有很多遗漏的。
于是按照找工作的习惯,从原型链开始,函数继承,页面渲染流程,页面性能优化,Promise,ES6,CSS,前端常见手写实现,把常见的知识点简单过了一遍。之后就是开始面试找状态。
石墨是我面试的第三家公司,前两家公司的请移步主页查看。
如果想获取更多的前端面试题,可以移步到宇宙有点全的前端面试题宝典里查看哈~
一面
-
['10', '10', '10', '10', '10'].map(parseInt) 的输出值是什么?
-
你们现在的技术栈是什么?为什么要使用ts?
-
ts中的 any、unknown 有什么区别?
-
setTimeout的执行过程(事件循环,同步、异步)
-
对Promise的理解,与async、await的区别,async、await是怎么实现的
-
解释 requestAnimationFrame/requestIdleCallback,分别有什么用?
-
react性能优化
-
说说对flex的理解
-
回流、重绘是什么?如何减少回流和重绘?
-
判断一个对象是数组的方法
-
怎么寻找react页面卡顿的原因
-
编程题:实现一个对象的 flatten 方法,如下:
const obj = {
a: {
b: 1,
c: 2,
d: {
e: 5
}
},
b: [1, 3, {a: 2, b: 3}],
c: 3
}
flatten(obj){} 结果返回如下
// {
// 'a.b': 1,
// 'a.c': 2,
// 'a.d.e': 5,
// 'b[0]': 1,
// 'b[1]': 3,
// 'b[2].a': 2,
// 'b[2].b': 3
// c: 3
// }
一面比较基础,面试官也很nice,对于我回答中不足的地方进行了提醒。
二面
-
说说对web worker的理解
-
service worker和强缓存相比,有哪些优势?
-
说说对堆栈溢出的理解
-
position中的sticky是什么,还有哪些其他的?
-
ts中,any和unknown分别是什么意思?泛型怎么使用?
-
bind有什么用?连续多个bind,最后this指向是什么?
-
webpack的plugin怎么实现?
-
编程题:
现已知一个字符串是由正整数和加减乘除四个运算符(+ - * /)组成。
例如存在字符串 const str = '11+2-3*4+5/2*4+10/5',现在需要将高优先级运算,用小括号包裹起来,例如结果为 '11+2-(3*4)+(5/2*4)+(10/5)'。注意可能会出现连续的乘除运算,需要包裹到一起。
请用 javascript 实现这一过程
上面是我能记录下来的二面知识点,整体来说,问的比一面更深。而且让人比较意外的是,二面中对于一面没有回答好的题目又重新进行了提问,对于面试过程中没有回答好的题目,还是得自己在面试结束后进行复盘。
三面
- 手写题:使用TypeScript 实现一个 get 函数来获取它的属性值
const data = {
name: 'tom',
age: 18,
address: xxx
}
这儿直接贴下答案:
function get<T extends object, K extends keyof T>(o: T, name: K): T[K] {
return o[name]
}
- ts中的 any 、 unknown 的区别
- 有用过ts中的 keyof 吗?
- for in/for of的区别
- Promise值穿透
- 【编程题】基于二面中的表达式包裹编程题,实现计算表达式的值
最后的一道编程题因为个人状态原因(面试节奏很紧凑),没能写出来,觉得有点遗憾。三面中ts方面的知识点较多,也问了不少其他方向的问题,比如项目相关,以及投石墨的原因,和自己的职业规划。
最后
上述面试题的答案,我大部分都进行了整理。
如果大家想查阅具体的答案,可以通过“前端面试题宝典”进行查找。
前端面试题宝典是我们几个小伙伴,在业务时间开发的一款前端面试刷题小程序,里面对前端的知识点和常见面试题进行了总结,还有面试技巧相关的文章,希望能够帮到大家。
觉得有用的,可以点赞收藏哦~