分享我所经历的"金三银四"，以及我被问到的135道面试题~

Sunshine_Lin
10,173 阅读12分钟

前言

大家好，我是林三心，用最通俗易懂的话讲最难的知识点是我的座右铭，基础是进阶的前提是我的初心。

金三银四还存在吗？

“金三银四”在今年还存在吗？我觉得还存在，但是今年确实是比以往难一些了，体现在几个方面：

  • 1、简历初筛通过率降低
  • 2、面试成功率降低
  • 3、薪资水平涨幅不大

这几年大环境比以前差，我看 Boss 上就能很好地体现这一点，主要体现在

  • 1、大部分都要 3-5 年的，以前 1-3 年很多的，但是现在变得比较少了，也就是年限越来越重要了
  • 2、招聘的多数为中/高级前端工程师，也就是初级前端工程师这一级别压力更大了
  • 3、薪资涨幅不大，毕竟根本不用担心招不到人

面试之旅

我是三月份开始面试的，差不多面了十几家公司，因为有些公司的需要一面二面三面的，所以大大小小面试次数也差不多有接近 30 次，由于我现阶段还不考虑去那种小公司，所以基本就是面这几个类型的公司：

  • 1、互联网大厂
  • 2、金融类大公司
  • 3、潜力型公司
  • 4、大厂旗下子公司

整体来说，面试的难度还是偏上的，因为现在的公司招聘越来越注重知识广度了，所以你在准备八股文的同时，也需要多学一些其他东西，比如 CICD、单元测试、工程化、算法、设计模式等等，并且现在的面试官也是越来越注重项目了，会问你非常多的项目，以及场景题~

某大型金融公司

这是一家比较大的金融公司，主要做的是一些金融系统，主要技术栈是 Vue、Angular，招的是进去做基础建设的，面试官人也不错，在问八股文的同时，也会多跟你聊聊你所做的一些项目，并会为你讲解公司现阶段需要做的东西有哪些，非常棒！

一面（时间很短）

  • 1、Vue通信方式有哪些？
  • 2、React通信方式有哪些？
  • 3、Vue3新在哪里？优化了什么？
  • 4、设计模式在项目中的应用场景？
    • 发布订阅模式
    • 装饰器模式
    • 适配器模式
    • 策略模式
  • 5、负责过哪些大型项目？负责什么模块？
  • 6、Vue和React的区别？
  • 7、一个登录页功能，你觉得需要注意哪些点？

二面

  • 1、自我介绍
  • 2、做过哪些大型项目，负责哪些模块？
  • 3、做过哪些性能优化？
  • 4、并发控制是如何做的？
  • 5、合并接口时需要考虑什么？
  • 6、怎么做全局按钮取消请求功能的？
  • 7、sourceMap打包后存放位置？
  • 8、让你设计一个错误监控系统，你怎么设计？
  • 9、错误监控推送是怎么做的？
  • 10、对CI/CD的理解？你们团队中怎么去用？
  • 11、说说你做的这个“xxxxxx”功能
  • 12、客户端的更新提示你是怎么做的？
  • 13、设计模式在你项目中的应用场景？
  • 14、为啥选Qiankun？不能iframe？
  • 15、写过单元测试吗？先写单测还是先写代码？
  • 16、最近学了哪些新技术？

某大型硬件公司

技术栈主要是 React + Vue + Electron，但是没问很多框架层面的东西，反而是更多问你项目的东西以及工程化相关的问题。一面面试官比较和蔼，二面面试官比较犀利，很注重你项目中做过哪些难点，会狂问你这个问题，并且会考你算法、逻辑、设计模式的一些场景题难度不低哦

一面

  • 1、项目做了什么亮点？
  • 2、改过哪些库的源码？
  • 3、错误监控怎么做的？
  • 4、Sentry是怎么做到错误监控的，原理是什么？
  • 5、对Electron的了解？
  • 6、网络连通性的优化是怎么做的？
  • 7、如何控制请求并发？
  • 8、Eggjs和Nestjs的区别？
  • 9、说一下洋葱模型，有什么案例？
  • 10、大文件上传怎么做到暂停、续传
  • 11、设计模式在项目中的应用？
  • 12、看过哪些好的设计，从中学到啥？
  • 13、发布订阅模式的应用？
  • 14、Vite和Webpack对比？
  • 15、Vite为什么快？原理？
  • 16、微前端原理是什么？怎么做隔离的？

二面

  • 1、说说你做过最复杂的功能？
  • 2、做过哪些性能优化？
  • 3、怎么界定性能好和性能差？
  • 4、Vite为什么比Webpack快？原理？
  • 5、Vite部署时遇到哪些问题？
  • 6、近期看过哪些新技术？
  • 7、算法题，都是一些leetcode的题
  • 8、设计模式题，考策略模式的题
  • 9、逻辑题，4个球怎么测出哪个最重？忘了~

某获得融资的潜力型公司

这是一家潜力型公司，获得大融资，主要技术栈是 Vue + React，一面面试官是前端负责人，比较注重基础，狂问一些基础问题，JavaScript、TypeScript、Vue、React 都问，问了超级多问题。二面面试官是团队负责人，是一个985大学的计算机博士，比较注重观察你的思维，以及计算机基础。老实讲，我计算机基础挺一般的~

一面

  • 1、自我介绍
  • 2、说说你做的比较有亮点的项目
  • 3、你做的 XXX 业务的原理是什么？怎么解析的？
  • 4、你做的 XXX 业务是怎么实现的？
  • 5、Vue 对象新增属性不更新问题
  • 6、为什么 Vue 更新数据不能拿到最新DOM
  • 7、为什么 nextTick 可以获取最新 DOM
  • 8、nextTick 原理
  • 9、Vue 怎么做到数据更新去更新视图的
  • 10、Vue router几种模式
  • 11、JS 的执行机制？
  • 12、React 父级获取子级元素的方式
  • 13、React 父级获取子级的数据的方式
  • 14、为什么可以直接获取 Antd 的 Ref
  • 15、useMemo 和 useCallback 的区别
  • 16、React 组件如何根据 props 决定要不要更新
  • 17、React 的 Fiber？
  • 18、Vue3 对比 Vue2
  • 19、tree-shaking 的原理？
  • 20、Webpack 打包过程原理？
  • 21、Vue 文件是怎么被解析的？
  • 22、Vite 对比 Webpack
  • 23、业务完全不一样，怎么转变
  • 24、有没有系统学习过一个东西
  • 25、学习的途径是什么？看书多吗？
  • 26、输入URL到渲染的过程？
  • 27、网络优化怎么做的？
  • 28、HTTP缓存的应用？详细说说
  • 29、强缓存存在哪？怎么决定的？
  • 30、怎么提高代码质量？具体措施？
  • 31、有什么想问的？

二面

  • 1、你们的产品包含了什么端？
  • 2、怎么解决各个端展示不同功能？
  • 3、设计模式：适配器模式在项目中的应用？
  • 4、HTTP2新在哪里？
  • 5、如果让你做头部压缩，你会怎么做？
  • 6、有没有系统学习一个东西？
  • 7、应用层 or 底层？
  • 8、说说你做的比较有两点的两个项目
  • 9、你们产品有什么优势？凭什么成为国内行业 No.1？
  • 10、说说有哪些请求 Header，有什么用？
  • 11、大文件上传的请求头
  • 12、平时除了开发，还研究其他吗？
  • 13、Vue优势在哪？为啥很多人选它？

某互联网公司

技术栈是 React，比较注重考验你的思维能力和学习能力吧~

一面

  • 1、简历项目问询 - 细节
  • 2、垂直水平居中
  • 3、一个简单请求的header会有什么字段
  • 4、map、filter、reduce 都怎么用？
  • 5、Symbol有了解过过吗？
  • 6、ES5继承、ES6类继承，静态方法？
  • 7、Promise 如何做超时控制？
  • 8、DFS 找节点
function depthFirstSearchNoRecursion (target) {
    const res = [];
    const stack = target.slice();
    // console.log(stack)
    while (stack.length > 0) {
        const node = stack.shift(); // 最上层节点出栈
        res.push(node.id);
        // 如果该节点有子节点，将子节点存入栈中，继续下一次循环
        const len = node.children && node.children.length;
        for (let i = len - 1; i >= 0; i--) {
            stack.unshift(node.children[i]);
        }
    }
    return res;
}
  • 9、Node有什么特性，适合用来做什么？
  • 10、midway对比egg有什么优势？
  • 11、typescript 有没有实践过？
  • 12、平时有用什么设计模式吗？
  • 13、平时打包工具 - Webpack 相关
  • 14、你有没有哪些我没问到你想说的？
  • 15、缓存相关，cdn 缓存处理？
  • 16、你有什么想问的？

二面

  • 1、压力面，质疑观点？
  • 2、拍平数组
const flatten = (list, level = +Infinity) => {
  // ...
};
const array = [1, [2, [3, 4, [5]], 3], -4];
const list1 = flatten(array);
const list2 = flatten(array, 2);
console.log(list1); // [1, 2, 3, 4, 5, 3, -4]
console.log(list2); // [1, 2, 3, 4, [5], 3, -4]
  • 3、Promise
const myPromise = val => Promise.resolve(val);
const delay = duration => {
  // ...
};
myPromise(`hello`)
  .then(delay(1000))
  .then(val => console.log(val)); // 一秒之后输出 hello

三面

  • 1、项目细节询问
  • 2、Vue 源码有读吗 - 响应式原理，nextTick
  • 3、最近有没有研究什么新技术？
  • 4、项目优化有哪些实践？
  • 5、业务方面优化
  • 6、请求方面优化
  • 7、打包方面优化
  • 8、架构方面优化
  • 9、V8 如何执行一段代码？
  • 10、72-编辑距离
  • 11、226-翻转二叉树
  • 12、性能优化的实践？
  • 13、有其他想问的吗？

某大型软件公司

这是我面试的第一家公司，面试官一上来就说：我这个人不喜欢问八股文，你可要小心了哦~

我：大佬，能不能放放水啊~

接下来分享一下面试题，以及回答的思路吧~

1、React和Vue的缺点是什么？

面试官反其道而行！不问优点，居然问缺点！所以我苦思冥想，觉得应该从这几个角度去回答：

  • Vue2的响应式缺点
  • Vue3怎么解决响应式缺点的
  • Vue和React的diff算法哪个高效，哪个相对低效
  • Vue2的Option Api有哪些缺点？
  • Vue3的Composition Api怎么去解决这个缺点？
  • React的门槛更高，比较难学（只是相对于Vue）
  • React的JSX和Vue的template都有哪些缺点？

2、JS有什么缺点？

同样的，也是平时大家很少想到的问题，JS有哪些缺点呢？我觉得从这几个方面去回答：

  • JavaScript的单线程问题（背景）
  • JavaScript用什么方式去弥补这一缺陷？
  • Web Worker为什么没有解决本质问题？（延伸出下一个问题）
  • Nodejs是什么？
  • Nodejs有什么优缺点（延伸出下一个问题）

3、WebWorker？

由上一个问题延伸出这一个问题，我思考一下，回答思路：

  • WebWorker的基本方法
  • WebWorker原理是什么？

4、Nodejs有什么优点缺点？

由上一个问题延伸出这一个问题，思考，回答思路：

优点

  • Nodejs为什么多并发表现优秀
  • Nodejs门槛为什么比较低？
  • Nodejs都有哪些优秀的框架？
  • Nestjs有什么优点？

缺点

  • Nodejs为什么不适合大项目
  • 有什么解决方案吗？（延伸出下一个问题）

5、为什么Nodejs不适合大项目？怎么解决？

由上一个问题延伸出这一个问题：

  • 稳定性？
  • 始终是单线程语言
  • 怎么去解决这个单线程问题？

正在我冥思苦想搜索有没有八股文应对这一难题时，面试官对我说：不需要说具体解决方案，就只需要说出你的想法即可。

我大喊一句：既然他只有单线程，那我就多开几个服务，那不就有多个线程了（我乱猜的🐶）

面试官说：诶，你这小伙子，很有想法哦~（原话）

然后就引出了下一个问题Serverless

6、说说Serverless？

没思路，因为我没用过，面试官跟我介绍了一会儿Serverless，我理解就是分散请求到多个服务，降低单个服务的压力~

我一想：啊，是微服务吗？

面试官说：不是，巴拉巴拉巴拉巴拉

我：哦。。这样啊。。。（没用过，我没话语权）

7、函数式编程？

这玩意网上都有资料，大家查查就行，思路：

  • 什么是纯函数
  • 函数科里化
  • 组合函数

8、单点登录SSO如何实现？

这个我还真没做过，但是我了解过这个概念，所以我想出一些方案：

  • 同域会携带Cookie
  • 第三方跳转url携带标识
  • 第三方不跳转的话，需使用iframe

巴拉巴拉巴拉，聊了挺多，牵扯出fireBase

9、fireBase？

我没用过，我理解就是前端起一个服务，在前端自己实现登录或者一些其他后端功能。。我咋感觉像小程序的云开发？

10、埋点方式有哪些？出一个方案？

这个啊，埋点有很多中方式，回答即可：

  • 手动埋点
  • 劫持Function进行调用时的埋点

自己发挥想象力吧~

11、如何设计一个项目架构，方便团队其他成员快速上手？

这个有的说：

  • 制定规范？
  • 强制团队成员学习？
  • 提供示例？
  • 搭建可配置化架构？

12、Nestjs的优点是啥？跟Eggjs的对比？

这个你们就网上找吧，我都是根据我使用时的体验去回答的，比如：

  • Eggjs定的规范太死了，太分散
  • Nestjs比较灵活，业务代码更加紧凑

结语 & 加学习群 & 摸鱼群

我是林三心

  • 一个待过小型toG型外包公司、大型外包公司、小公司、潜力型创业公司、大公司的作死型前端选手；
  • 一个偏前端的全干工程师；
  • 一个不正经的掘金作者；
  • 一个逗比的B站up主；
  • 一个不帅的小红书博主；
  • 一个喜欢打铁的篮球菜鸟；
  • 一个喜欢历史的乏味少年；
  • 一个喜欢rap的五音不全弱鸡

如果你想一起学习前端，一起摸鱼，一起研究简历优化，一起研究面试进步，一起交流历史音乐篮球rap，可以来俺的摸鱼学习群哈哈，点这个，有7000多名前端小伙伴在等着一起学习哦 --> 摸鱼沸点

image.png

avatar
文章
阅读
粉丝