前端面试日记：字节一面凉经

面试公司：字节

面试岗位：前端

积极准备了整整一周，还是以惨淡收尾，这几天甚至做啥都没心情了，感觉自己就是小趴菜。

外加最近面了个某小厂，上来就考css有哪些函数，array有哪些方法，我还只能答个两三个，心态崩完了。

但是晚上鼓起勇气想想，这又怎么样呢，比起更严峻的vaja，前端的行情已经好太多了。况且目前只是一面挫折，前方还有数不清的面试在等我（虽然大厂寥寥无几），还是得鼓起勇气向前看的，人类的赞歌就是勇气的赞歌。

这里非常感谢阿里的面试官黑子佬，在淘系直接初筛就把我毙了的情况下，仍然愿意在下班时间为我提供大量的指导，让我知道当今互联网还是有那么一些人，坚守着本色初心，不带课挣钱，不图利割韭菜，传播着已被大众渐渐淡忘的互联网精神。也正是这样，我和他约定，要将这种精神传承下去。

而以往及未来的面试日记，就也权当是一种精神的传播吧，希望观者也能将该精神传播下去。

（顺便希望有能力的佬多投投阿里的前端岗，****目前有很多的阿里前端hc，我相信阿里有黑子佬这种人文关怀的mentor在，不论是团队氛围还是学习环境都是上上乘的，可惜目前的我无缘这种团队）

因为是大厂，所以我直接放全流程。

老样子，问题来源于面试官，回答来源于ai，反思来源于我。

[闲聊和八股]

1、 问题：你本科是偏硬件的，为何想到转前端？有没有考虑换其他方向？

答案：本科的硬件背景让我对计算机系统的底层原理有了扎实理解，但实践中我发现更享受通过代码直接创造用户可感知价值的过程。前端开发完美结合了工程严谨性与艺术创造性——通过优化渲染性能让界面更流畅、设计交互逻辑提升用户体验，这种即时反馈和影响力让我着迷。转行并非一时兴起，而是经过系统性的技术对比和项目验证。我曾用Three.js实现过硬件加速的3D可视化项目，发现前端领域对多学科融合（如图形学、编译原理）的要求极高，这与我追求技术深度的目标一致。至于其他方向，我保持开放心态，例如深入Node.js全栈或探索WebAssembly性能优化，但现阶段更希望在前端领域建立垂直技术壁垒，持续深耕框架原理、浏览器内核等方向。

反思：记得不要全盘托出，记得表明自己的信心与欲望。

2、 问题：你是如何进行前端相关的学习的？

答案：我的学习体系采用「金字塔模型」：底层夯实标准（MDN/W3C规范）、中层框架原理（React源码精读）、上层工程实践。例如学习Vue3时，我会先通读Composition API RFC，再用TypeScript手写响应式系统，最后通过SSR+微前端方案落地复杂项目。

持续参与开源是重要手段，同时建立知识反刍机制：每周撰写技术文章（已发布40+篇）。最近正系统学习Chromium源码，结合Performance面板分析合成层优化策略，这种理论到实践的正向循环显著提升了复杂问题拆解能力。

反思：要让面试官知道自己的前端兴趣与深挖的能力。

3、问题：简单讲讲你的这个项目？

答案：略。

4、问题：如果该项目有后端，你会如何搭一个服务实现前后端交互？

答案：我会设计分层API网关架构：

BFF层：使用NestJS按业务域拆分GraphQL端点，利用DataLoader优化N+1查询问题，配合Apollo Federation实现服务聚合。

鉴权：基于JWT + Redis设计令牌刷新机制，敏感操作启用双因素认证，在网关层实施RBAC策略。

通信优化：对实时数据采用WebSocket + Protobuf二进制协议，设置增量更新补丁机制。静态资源走CDN，启用HTTP/3+QUIC提升弱网性能。

容错处理：实现Circuit Breaker模式，前端内置请求重试队列，服务端返回标准错误码（如429时携带Retry-After）。

监控层面，前端部署Sentry+Performance Observer，后端集成OpenTelemetry，实现全链路追踪。

反思：对后端的了解程度，考察基本能力。

5、问题：URL请求后发生了什么？

答案：略

反思：常见八股，无需多盐。

6、问题：TCP和UDP连接区别？

答案：略

反思：常见计网，无需多盐。

7、问题：讲讲TCP的拥塞控制算法？

答案：TCP拥塞控制通过AIMD（加法增大乘法减小）原则平衡网络效率与公平性，核心阶段：

慢启动：初始cwnd=1 MSS，每RTT指数增长直至阈值

拥塞避免：线性增长，每RTT增加1/cwnd

快重传：收到3个重复ACK时立即重传，无需等待超时

快恢复：将阈值降为当前cwnd一半，直接进入拥塞避免阶段

反思：唉，别问，问就是忘了。

8、问题：MySQL和MongoDB的区别？索引是什么？

答案：MySQL作为关系型数据库，适合事务性操作（ACID），通过预写日志保证持久性。MongoDB是文档型数据库，Schema灵活，适合迭代频繁的场景，通过分片集群实现水平扩展。

索引本质是数据结构优化查询路径：

MySQL使用B+树索引，支持范围查询和排序，聚簇索引直接存储行数据

MongoDB使用B树，支持多键索引、地理空间索引，复合索引字段顺序影响查询性能

索引代价：写操作需要维护索引结构，需在查询性能与写入开销间权衡

前端虽不直接操作数据库，但理解索引原理有助于设计高效API。例如为分页查询优化联合索引，避免filesort；对JSON字段建立函数索引提升搜索速度。

反思：真没想到会问数据库，有时间去简单瞅瞅。

9、问题：HTTP请求方法及GET/POST区别？

答案：略

反思：常见八股，无需多盐。

10、问题：强缓存和协商缓存区别与对应参数？

答案：略

反思：常见八股，无需多盐。

11、问题：Etag是什么？里面有什么内容？如何得到的？

答案：Etag是属于HTTP 1.1属性，Etag（Entity Tag）是HTTP响应头中用于资源版本标识的机制，本质是服务端生成的资源唯一性标识符。Etag值是一个ASCII字符串，通常由服务端根据资源特征生成，常见形式包括：强验证器：如哈希值（MD5、SHA-1）、版本号（"686897696a7c876b7e"）；弱验证器：以W/前缀标识，如W/"v2.1"，适用于内容语义不变但字节变化（如注释修改）。

通过合理应用ETag机制，可减少30%-70%的冗余数据传输，显著提升大型应用性能。在实际工程中，我曾针对SPA的静态资源部署，设计基于内容哈希的ETag生成策略，使得版本发布后用户缓存自然失效，同时保持未变更资源的304响应，将首屏加载时间优化了42%。

反思：这是什么？这是我能答得吗？

[手撕，这里开始炸] (手撕为纯白板飞书上手写）

1. 用异步写个定时器

反思：疯狂爆红，没写过异步的下场。前面说异步接触的不多这里就疯狂的针对，下次跟面试官说自己不会的东西就说自己最熟悉的东西好了。

2. 看代码写异步结果(setTimeout, Promise)等，并用event loop解释

反思：还在异步，麻了。

3. 手写观察者模式

反思：凉经的终结点，不交流沟通，盲目瞎写，写完也不汇报，这里估计是面试官决定放弃的地方。

反思：

之前一直不敢回忆，觉得自己答得很烂，但是现在想想，其实自己八股基本都答上来了，面试官也没有表示不耐烦，自己凉的原因应该是另外两点：1. 在面试官没有很好的表达对前端学习的强烈欲望，以及“非科班”的烙印，数据库等未涉及非常的影响；2. 手撕刚开始就炸了，异步没有从头手写过导致一直爆红；手撕前未与面试官积极沟通，并且在不理解面试官的意思下沉默地写错误地代码。

这两点致命的错误导致了一面直接凉凉。之后要做到首先表明自己的学习状态，其次手撕时要与面试官积极沟通，争取之后面试再接再厉。