来自一个渣渣的万字前端面经 小米 头条 高德 360 美团 等

1. 先做自我介绍。
2.  聊一下vue和react的区别。
3.  react生命周期有哪些（我直接说我记不住，我是从hooks开始用的）
4. 你说你用hooks，hooks解决了什么问题。
5. 小程序了解嘛，小程序跳转传参怎么传（我说的是拼到url后面，然后到另一个页面的onLoad中接option参数，面试官质疑了一下，因为我小程序写的很少，我以为我记错了，我就直接说我对小程序不熟，他就没继续问，后来我看了一下的确是这么传，所以很迷惑）

1. 常规自我介绍
2. 一面面试官都问你什么了
3. webpack优化都做过哪些
4. 浏览器缓存机制了解么
5. 手写一个new
6. 手写一个bind
7. 继承了解么，组合寄生解决了组合继承的什么问题，怎么解决的（我说了组合继承和组合寄生继承，然后写了一下组合寄生）
8. 原型链讲一下，__proto__是标准么（讲真，如果这么问肯定不是标准，我只说了现在已经不推荐使用了，但是我不知道是不是标准，面试官跟我说这个不是标准，这个是浏览器实现的）
9. 如果现在localstorage存储量限制到了1MB，现在里面存了各种各样的东西，已经有了一个计算规则的方法，调用这个方法就能把符合规则的数据删掉。那比如现在已经存了1000KB了，又来了个的数据，如果存上它就会超过1MB，你要怎么存进去。（我说的算出来如果存进去会超出多少KB，然后开始递归调用那个方法去删数据，每次删的时候把删了多少存起来，直到删够，再存）
10. 一个数组，里面是排好序的数字，输入一个数字怎么能找到它的index。（讲真看见这个我就知道想问我二分法，可我偏不这么答。我就说把这些数字放到对象的key里，index变成value，然后直接取，面试官问我这样时间复杂度是多少，我说初始化是O(n)，以后是O(1)。他问我能不能优化，我就说二分法，他说你写一下吧，我的犯二就开始了，把Math.floor记成了向上取整，写完之后他跟我说这种细节要注意。之后问我二分法的时间复杂度是多少，我知道是O(logN)，但是我不会算，我怕被问怎么算的，我就说我不知道）
11. 之后我问技术栈主要是什么，业务主要是做什么，加班情况，跟一面的那个部门的区别。

小米有品三面：

1. 自己是怎么学习前端的，未来的规划
2. 聊一下https，数字签名了解么（数字签名我没说上来）
3. 设计模式（我说了单例、工厂、适配器、装饰器、发布订阅、代理）
4. 聊一下跨域吧，img标签为什么没有跨域问题
5. 现在有一个数字，存的是公司两万人的数据，提供了一个getById方法一个getByName方法，如果想查找的话就得去循环。你做这个事情的话，怎么去做优化
6. 有一个数字字符串，它所代表的数字远大于js所能表示的最大数，可能有两万位，这样的数字你怎么判断它能不能被6整除。
7. 你觉得你性格偏强势，中庸还是弱势
8. 期望薪资多少

周三我催了一下。。。因为已经面了三周了，有点着急了。然后HR说周四周五给我消息。

周五我又问了一下进展，HR小姐姐跟我说有品这边实在争取不到了，帮我推到了小米金服。我感觉不能坐以待毙。。。就去boss上把小米的招聘者挨个聊了一遍，跪求给机会，然后度过了煎熬的一个周末。

周一早晨，一个小米商城的大佬回我了，跟我说可以了解一下，然后HR安排了我周二下午面试（从头开始面）。

然后又是牛客网，重新一面。

1. 手写bind
2. 手写继承（直接写的组合寄生）
3. 手写一个事件触发器，有 on/emit/off/once 这几个功能
4. 现在有一个很大的项目，里面用了很多的发起请求的第三方包，现在要给它统一加日志，这个怎么做（这是我唯一没说上来的，其实很简单。。。复写一下window.xhr里的方法就行了，面试的时候没想到）
5. 问了一下promise怎么实现的异步队列，怎么实现的链式调用
6. vue双向绑定原理（注意不是响应式原理，不是简单的回答defineProperty）
7. 移动端适配都做过哪些（我说了媒体查询，px2rem，flex，grid）
8. 1px边框问题怎么解决的
9. 重绘和回流是什么，如何优化，如果有必须回流的应该怎么办
10. 有一个盒子，里面放一张大小不一定的图片，怎么让它填充（我说了最简单的背景图片cover，还有js获取图片宽高再比较一下，再决定往哪个方向居中）
11. 如果一个列表有很大量的数据，数据过多会导致dom过多然后页面卡顿，怎么解决（我说了虚拟滚动，还有在虚拟滚动基础上对体验的优化）
12. 虚拟滚动的话滚动条怎么处理（这个我真没处理过，我做的是手机端的，然后大概说了一下思路，其实应该也是可行的）
13. 问了一道算法题，贪心算法，我看过这个题但是没做，面试官给了一点思路我做出来了了。详见 两地调度。

1. 老规矩，自我介绍。
2. 是怎么接触前端决定做这个的，未来的职业规划是怎样的。
3. 面试官说看我了解了flutter，能让我简单介绍一下和rn的区别么（我没写过rn，但是基本是干什么用的我还是知道的，然后我就说了一下dart的语言特性，flutter的性能，语法，还有我踩过的坑）
4. 你说你是米粉，那你是怎么接触小米的，为什么会喜欢小米（这可是撞枪口上了哈哈哈哈哈，我一个六年米粉 + 雷总粉丝，回答这种问题可是太简单了。先说了我用过哪些小米手机，然后我随手拿了几个手边的小米产品，又说了说我对雷总哪些发布会的哪些话记忆深刻，还有黎总的参与感各个章节里的一些观念对我的影响）

小米商城终面：

  1. 自我介绍

  2. 大学是什么专业（信息管理与信息系统），基于什么考虑去做前端了呢

  3. 你最近的这份工作是属于哪个部门，你负责哪些业务，你觉得你这份工作里做的最有成就感的事情是什么，这份工作给你带来了怎样的提升

  4. 你主要技术栈写的是vue和react，之前的公司主要用vue，那么react你是怎么接触到的呢

  5. 看你简历里写了flutter，能简单介绍一下么

  6. 期望待遇是多少

  7. 你觉得你的优点是什么

  8. 我感觉你对于技术好像更喜欢一些，对业务上不太敏感，聊一下你的想法

  9. 你还有什么想问我的么（我问了团队里对于技术需求和业务需求上的平衡，和加班情况）

终面结束，我感觉沟通还是很愉快的，当天晚上HR小哥让我等消息，转个周一HR面，周四接到的offer，这次效率还是蛮高的。

从第一次接到小米面试邀请到拿到offer，整30天

美团：

1. 手写new
2. 手写Map，就是es6的那个Map（这个我没写出来，后来查了一下是桶算法加上哈希算法实现，这个没办法了。。。是真不会）
3. 问一下网络方面的吧，get和post区别
4. 发起post请求的时候，服务端是怎么解析你的body的（content-type），常见的content-type都有哪些（我说了postman里的那几个），发文件是怎么解析的（FormData），如果多个文件，文件之间是如何分割的（boundary）
5. https了解么，证书是做什么用的
6. 聊一下项目经验（问到了一个socket.io的项目）
7. 还有什么想问我的（我问了技术栈，这边主要是vue+ts，然后聊了一些这方面的坑是怎么处理的，问加班情况）

面试结束，没通过，主要是卡在了Map那块，而且证书那块我也没说好，失去了一次进大厂的机会。

玩吧一面：

1. 自我介绍
   
2. vue和react对比
3. vue的diff算法和react有什么区别，有没有更好的diff方案（我看过一个inferno的diff算法，但是到了递归子序列那块我就看不懂了）
4. 聊一下react hook，做了哪些事
5. vue3用了proxy解决了什么问题（我讲到了vue2是怎么解决这些问题的，说到复写数组方法的时候他还问我那部分是怎么实现的）
6. 怎么自定义v-model（文档有，但是我没看），怎么父子组件双向绑定
7. vue传值方式（说到了provide/inject，他问我有没有用过，我说官方不推荐用，他说虽然官方不推荐用，但是官方说写基础组件是可以用的，有了解么，没有）
8. 手写new
9. 原型是什么，原型链是什么
10. 有没有了解过babel
11. 知道px2rem是怎么实现的么
12. 浏览器缓存了解哪些
13. 浏览器事件循环和node事件循环有什么区别，如果一个微任务中又生成一个微任务，这个微任务什么时候执行
14. ts了解么，枚举是什么，怎么用js实现枚举
15. 函数重载了解么，讲一下是做什么的
16. 你的优点和缺点

玩吧二面：

1. 数组和链表的区别，如果让你实现一个数组，底层代码你怎么设计
2. 了解内存有哪几个分区么（我只知道堆栈），普通数据类型能不能放到堆里，堆栈哪个更容易产生碎片，为什么会产生碎片，碎片是什么
3. TCP了解么，滑动窗口讲一下
4. https私钥是哪边生成的，如何生成的
5. 个人的优缺点
6. 怎么了解到玩吧的（微博热搜啊！#玩吧崩了#，#玩吧又崩了#）
7. 期望薪资

玩吧面试过了，已接offer，二面很像是压力面试，至少我没几个会的，但是还是过了。

自如一面：

1. 如何将普通数据类型以引用类型存储
2. 闭包的应用场景，class/symbol如何实现私有属性
3. nextTick，setTimeout和setImmediate的区别
4. promise 有几种状态，Promise 有什么优缺点，Promise构造函数是同步还是异步执行，then呢，promise如何实现then处理，如何实现 Promise.all，如何实现 Promise.finally
5. 关于网络连接的建立以及断开, 存在着一个复杂的状态转换机制，说说你知道的。TIME_WAIT 是什么情况? 出现过多的 TIME_WAIT 可能是什么原因? 
6. 标准的 JavaScript 错误常见有哪些？Node.js 中错误处理几种方法？怎么处理未预料的出错? 用 try/catch , 还是其它什么?
7. 数组的排序？描述二叉树的几种遍历方式？
8. HTML5的离线储存怎么使用，工作原理能不能解释一下？浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢？刷新页面，js请求一般会有哪些地方有缓存处理？
9. 现在要你完成一个Dialog组件，说说你设计的思路？它应该有什么功能？JSX/TSX？
10. Vuex、Flux、Redux、Redux-saga、Dva、MobX？简述思想？
11. process.env.NODE_ENV是什么？说一下 Process ，以及 Require 原理？
12. npm 与 yarn 对比？关于 package-lock.json 和 yarn.lock？
13. 说下渐进式框架的理解？以及曾开发过的组件库/工具库/脚手架的架构设计方案？
14. 性能调优？webpack对项目进行优化？
15. 过滤 Html 标签能否防止 XSS？请列举不能的情况? 并说下网络安全？
16. 是否写过测试用例？

讲真，一面答的很惨，这是我这次找工作第一个面试的公司，没什么准备。但是居然还过了

自如二面：

1. 聊一下之前做的项目
2. 更想做业务还是更想做技术（我说我想做技术，不是特别希望做业务，她说我才刚刚毕业不到两年，技术大佬也都是从业务上摸爬滚打写出来的，不能这么年轻就不想写业务了）
3. 期望薪资

还聊了点别的，具体记不清了，然后就给我安排了HR面，HR问了问我前两段的离职原因还有期望薪资，聊完之后说后面会有安排谈薪。

同程艺龙：

1. 输入url回车之后到渲染页面都发生了什么，哪些地方可以优化
2. redux和vuex的区别和优缺点
3. vue-router源码是怎么实现的
4. 讲一下http协议
5. 讲一下https
6. 有一个数组，里面是1GB的数据，都是数字，运行内存只有500MB可用，怎么取出来这里面最小的前100个数

之后我问了问前端工程化方向都做了哪些，比如code review，自动化打包，自动化测试，性能监控，异常监控等等。后面我问了问加班情况，还有疫情期间加班都是在做什么需求（为什么一个旅游业的公司疫情期间需要995。。。）之后就没再联系过我，另外让我不太爽的是面试前一分钟，面试官跟我说面试推后一个小时。

京东一面：

1. 用vue多还是react多（我vue起手的，react从hook开始用的）
2. vue双向绑定原理
3. vue3改成proxy做了哪些事
4. vue-router源码了解么
5. slot了解多少
6. keep-alive讲一下
7. 比较常用的生命周期都有哪些
8. 路由的生命周期都有哪些
9. 如果让你实现一个权限控制的功能，你怎么实现
10. vuex都有哪些方法，大概讲一下，它是怎么实现的了解么
11. react hook解决了什么问题，对生命周期是怎么处理的
12. react中的ref有什么功能
13. 受控组件和非受控组件的区别
14. react比vue好在哪

面试官跟我说他想问的就这些了，我问他我是不是凉了，他说我过了。。。emmmm，之后我问了问技术栈，主要是react class component + ts + egg

京东二面：

1. 介绍一下你做的项目里比较有难点的比较复杂的项目，然后介绍一下你都怎么解决的以及学到了什么
2. 你平时用Mac还是Windows开发（我直言比较穷苦，买不起mac，自己组装的黑苹果）
3. 平时遇到问题都是怎么去网上找解决方法，看Google的话，用什么fan qiang
4. 对于加班是怎么看的
5. 未来规划是怎么样的

之后我就问了问公司的加班情况，还有公司对于技术需求和业务需求如何在时间上做平衡，面试过程很愉快，就结束了，说让我等之后的同事联系我。。。然后就没再联系过我，我没太懂为啥一轮谈人生谈理想的面试还能挂了，难道是因为我穷么

两周后，HR给我打电话，说聊一下，问我都有哪些offer，我说有头条和小米了，就没聊下一步😶😶😶头条竞争力这么大么

作业帮一面：

1. storybook你用过哪些功能，它有什么好处
2. ES6用过哪些新特性
3. css-in-js都用过哪些，如何应用的
4. Redux的核心方法是哪个，compose是怎么实现的，action里怎么做异步操作，有没有在redux里用过rxjs（rx几乎没用过。。。）
5. jest单元测试用过哪些功能，怎么做的测试，有没有对每个方法都写单元测试
6. nginx你用来配置什么
7. 常用Linux命令都有哪些（rm -rf /*）
8. 树莓派你玩的哪个版本，都做了什么
9. 你平时用Mac还是Windows（我两台win台式，一台win笔记本，一台黑苹果），为什么不考虑买一台正版的苹果本（穷）
10. 写过Flutter是吧，讲一下Flutter的布局吧
11. 你ts有没有和vue结合过（有，因为vuex放弃了）
12. 看你简历里写了经常在组内分享新技术，你都分享过哪些
13. 手写JSON.stringify方法（很多比较麻烦的情况都没考虑，比如function之类的）
14. vue，在template标签里写了个{{a}}，data里有一个a一个b，在mounted阶段修改了b，会不会触发重新渲染（我直接从依赖收集源码讲到派发更新）
15. 未来的规划
16. 近期打算学什么技术

前几个问题几乎都是我简历里写的，面试过程比较愉快，我玩过的东西面试官几乎也都玩，面试结束后hr跟我说面试通过了，十五分钟之后二面。

作业帮二面：

1. 上一段工作时间不长，为什么考虑离职呢
2. 讲一下你做过的比较复杂的项目
3. 你觉得前端未来会是个什么趋势（我提到了Atwood定律），你觉得为什么会有这个定律
4. 未来的规划你想做技术，那你想向全栈方向发展还是往前端工程化架构方向发展呢，为此你有没有什么积累
5. 看你还做过Flutter，为什么会喜欢写这个呢（直言学了之后才感觉很不喜欢Flutter，学这个就是为了跟客户端撕逼更容易）
6. 你怎么看待加班

这边好像基本上不怎么加班，而且管三餐，不打卡，干完活就可以走，还是不错的

作业帮终面：

1. 自我介绍
2. 介绍最出彩的项目，怎么解决的问题
3. 有没有遇到过搞不定的问题
4. 页面白屏事件过长，有哪些可能
5. defer和async有什么区别
6. 移动端适配做过哪些
7. 现在团队有多少人，如何分工，平时多久上一次线
8. bug和产品开发会优先做哪个
9. 如果bug分配给你了，你觉得不是你的问题，你会怎么处理
10. 如果一个bug服务端改也行，前端改也行，这种你会怎么处理
11. 你现在团队中你觉得哪里比较好，哪里有不足
12. 压力大么，工作忙么
13. 如何学习新技术
14. 有和社区，技术圈的人交流嘛
15. 介绍一下Flutter，Flutter的渲染机制了解么，和js写的项目比有什么区别
16. 会了解w3c的新标准么
17. 做业务和做技术你喜欢做哪个

字节跳动一面：

1. 自我介绍
2. 先介绍一个你项目中比较复杂的项目，都学到了什么，解决哪些难题
3. 为什么你这个项目用egg呢，能简单介绍一下koa的洋葱模型么
4. node的事件循环机制介绍一下，nextTick了解么
5. 写了个setTimeout和promise执行顺序的题，然后问为什么
6. js是单线程执行的，就会有一些性能上的问题，有没有了解过有哪些方式能更加充分的去利用机器的资源
7. 一个5TB的文件，只有500M的空间，怎么进行转储，stream了解么，它有什么好处（这个我答的特别不好，几乎没用过）
8. vue响应式数据原理介绍一下，它对数组是怎么处理的，vue3的做法了解么，有什么好处
9. 浏览器都有哪些存储方式
10. 为什么会有跨域问题，跨域都了解哪些方式
11. positon都有哪些属性，都相对谁
12. 平时如何学习
13. 箭头函数与普通函数的区别
14. 手写bind
15. 手写instanceof
16. 打开手机抖音，到看到界面，都经历了哪些，介绍一下
17. ip和mac的区别，刚才你说的这个过程，哪些用到ip哪些用到mac
18. 线程和进程了解么，多个线程之间哪些资源是共享的，多个进程之间如何通信（通信这个我不知道）
19. 实现一个Queue，task方法可以添加任务，在一段延迟后执行下一个任务，start方法开始这个任务队列

20. 给一个hosts的数组，一个ping方法，ping方法可以在这个host成功时返回这个host字符串，失败时返回异常，实现一个quickFind方法，找到最快的host
    

    
    

面试结束后大佬跟我说让我先去吃午饭，下午会有同事联系我，7，17，18我答得很不好，下午四点多给我来的电话，约的晚上八点二面

字节跳动二面：

1. 自我介绍
2. css怎么实现一个两栏布局（圣杯），原理是什么，怎么用flex实现，flex有没有遇到过safari浏览器的兼容问题
3. 怎么实现一个田字布局，水平垂直居中
4. 写个防抖
5. 动态规划 100级台阶问题，分别用递归方式和动态规划方式写
6. 你之前工作强度大么，能不能接受大厂工作强度大
7. 如果你的node工程因为访问量逐渐增大，导致响应越来越慢，有什么办法解决
8. 如果你的node工程因为内部异常，频繁重启，有什么办法解决
9. pm2有了解么，集群是启动到多个进程上还是线程上
10. 对Docker有了解么
11. 函数式编程了解么

二面感觉在前端方向问的很少，大部分都是比较开放性的或者算法和工程化方向的问题，再以此引申出其他问题，面试刚刚结束，面试官给我打电话说晚上十点约三面

字节跳动三面：

1. 从技术方面介绍一下你自己
2. 说一下你做过的比较复杂的项目
3. 离职原因
4. 写个题，输入12345，输出 一万二千三百四十五，考虑到亿
5. 对未来有什么规划

那个题我写了半个小时，其实还有一些问题没考虑到，头条面试结束，转天下午HR加我微信，说再转天的下午HR面

HR面问了问之前离职原因，做的项目，薪资，未来规划和其他offer情况，说需要在几个候选人中筛选一下，一到两周给回复。

转个周一下午收到offer，财经业务部

360：

1. 怎么接触的前端开发
2. 学习过程中对前端哪方面比较感兴趣
3. 对前端业务方面感觉怎么样
4. 你怎么理解前端工程化
5. ts有没有遇到过什么问题，写基本的业务感觉可以么
6. 浏览器缓存机制了解多少
7. Service Worker了解多少，有什么应用场景
8. 协商缓存在HTTP1和2有什么区别
9. HTTP1和2都有哪些区别，HTTP2怎么解决的队头阻塞，多路复用是怎么做的，HTTP1队头阻塞在Chrome里最大连接数量是多少，HTTP1和2在做持久连接上有什么区别，HTTP2的服务端推送是怎么做的
10. 浏览器存储了解多少，都用过哪些
11. HTTP常用的状态码
12. 前端安全有哪些了解，XSS是什么原理，如何防范，CSP是什么原理，CSRF是什么原理，如何防范，CSRF token是什么原理
13. HTTPS了解过么，它是一个协议么，SSL和TLS有什么区别，最新的规范还有对称加密么
14. 加密算法都了解哪些，都有什么应用场景
15. vue和react有什么区别
16. vue计算属性和method有什么区别，和watch又有什么区别
17. 如果你自己实现一个组件，可以让用户自定义一些组件内某些部分的内容，怎么实现，除了slot还有别的方法么
18. react hook有了解么，它解决了什么问题
19. vue远房亲戚传值方式

真不愧是做安全的，前端安全和HTTPS那块我答的挺不好，问的特别细致，只看过点相关文章根本没戏，剩下的倒是还行，整体感觉，凉了

高德地图：

1. 主要用vue还是react，对比一下这两个框架
2. 你说到vue的响应式，react在这方面怎么做的
3. 用vue的时候有遇到过什么问题
4. 在做依赖收集的时候，如果有一个状态，在template里没有，但是我在js里alert了它一下，那它会被依赖收集么
5. vue的nextTick，为什么要有一个降级的过程，为什么最先使用的是setImmediate，它比setTimeout好在哪
6. 实现一个 on/off/emit/once 的类。它的this怎么处理，如果emit的时候执行了一个异步方法，如何让异步阻塞地执行。假如希望实现在callback里可以调用next让方法执行到下一步，这个如何实现。
7. 怎么实现一个promiseFy方法，把回调改成promise，这里面的this怎么处理
8. 如何以对象的形式拿到url后面的参数，url有可能会有哈希，哈希可能在参数前也可能在参数后。
9. 实现一个Array.prototype.reduce的垫片

阿里面试感觉就不一样，面试之前跟我说下载个sublime，不要装任何插件，全程给引导，面试结束后还会对我的优势，缺点和努力方向做出评价，感觉很不错，就是这波面试有点惨，肯定是凉了的

果然，两天后来了个邮件，凉了

好未来：

1. 自我介绍
2. css盒模型
3. BFC讲一下，都有什么应用
4. 为什么float会脱离标准文档流，还有其他脱标的方式么，除了position还有么
5. flex讲一下，flex-grow重点讲一下
6. 定位讲一下，固定定位是相对盒模型的哪里定位的
7. 原型是怎么理解的，实例和构造函数有关系么
8. es5怎么实现一个继承，寄生组合继承除了避免二次执行父类构造函数，还有什么好处
9. koa的中间件机制讲一下，为什么会有这种机制，好处是什么，什么原理
10. react hook解决了什么问题
11. vue和react的区别
12. 你刚刚提到vue的依赖收集，这个是怎么做的
13. 浏览器缓存机制
14. Promise都是怎么用的，它本身的原理介绍一下，你刚刚提到的执行器是同步还是异步
15. 浏览器事件循环机制介绍一下，你说是宏任务先执行，那为什么setTimeout是宏任务，它却会在promise之后执行呢
16. async/await了解么，generator用过么

整体面试过程还算是愉快，事件循环机制说完了之后他问我还有什么要补充的，我没想到还有什么补充的，koa的好处和原理我没了解过，generator我没用过，别的都答得还凑合。都是常见题