滴滴实习内推

人生第一次面大厂，和节子挺有羁绊的，浅浅记录一下吧-----------------------------------------------------Timeline：一面        2025-05-07    15-16    当天17: 00 通过二面        2025-05-08    14-15    当天15: 40 通过三面        2025-05-12    15-16    当天20: 38 面挂[HR姐姐说一面二面面评不错，商业化CRM可以捞捞，换部门加一轮面试即可]四面        2025-05-13    17-18    当天21: 31 面挂------------------------------------------------------一面面经-5.7：1. 自我介绍2. 项目性质：你提到的两个项目是练手还是实际投入使用的呀？3. 问项目难点（1）说论坛的游客模式 => 问登陆&登陆态是怎么实现的登陆这块是怎么做的？登陆态是怎么维护的？用户刷新后仍然是登陆状态，怎么判断的？（判断token是否存在）token存在哪里（localstorage里面）token有时效吗？（三天半）你怎么判断它过期的（jwt）你怎么使用jwt解析的 localstorage里面有时效吗？（2）消息实时推送SSE（3）安全性优化（加入csrf）追问：你可以详细介绍一下CSRF吗？你对别的攻击方式了解吗（回答了XSS、提到有分为存储型XSS和反射型）追问存储型和反射型区别4. 自己提到项目收获和项目的开发流程5. 问怎么了解到的项目整体规范开发6. git开发工作流熟悉吗？回答说对于分支流转比较熟悉追问 git merge 和 git rebase的区别rebase使用有什么风险 如何规避风险：影响公共分支追问：怎么样影响的公共分支面试官解释：风险产生的本质原因是git rebase 时候要强推（并且必须强推）7. 对axios封装以及取消重复请求是怎么实现的？追问post请求的避免重复请求是怎么实现的，可以怎么优化8. 节流防抖使用场景9. 图片懒加载追问offsettop是元素距离谁的追问只判断offset整体位置可以吗面试官补充offsettop定位的元素不一定是滚动元素10. Vue2和Vue3的区别11. 问react项目经验12. react hook的原理介绍一下追问hook使用有什么限制吗13. useEffect和useLayout Effect区别14. 一道算法题: 比较版本号【一面面试官是个很温柔的姐姐，提问循循善诱，引导型，面试整体体验很舒适（不敢想要是面过了，姐姐是mentor该有多幸福）】------------------------------------------------------二面面经-5.8：1. 自我介绍 （改进了下自我介绍，明显感觉面试官很赞许【听自我介绍的面试官不多见，感动子】）2. 学校专业课学了哪些课程(自我介绍提到成绩专业第一， 回答数据结构、操作系统、计网、 电子技术基础等)3. 什么情况下促使你去学习前端的 4. 问数据结构问题：讲一下数组和链表的区别 （说数组像整齐排列的房子、链表像一串手串云云）5. 讲一下树的遍历和图的遍历 （答主有点学院派，问数据结构问到点上了，爽）6从浏览器发起一个请求，到请求返回中的过程中，整个请求到响应的路径很多情况下都有缓存。尽可能把缓存说清楚，有哪些缓存（说了强制缓存和协商缓存）追问除了浏览器层面的强制缓存和协商缓存还有哪些缓存，提示如DNS、服务器缓存（讲了DNS缓存， 自己补充讲URL输入到页面呈现的过程）追问其他的缓存7. 你们做系统的静态资源是托管在哪里的，是部署在服务器吗（补充讲项目开发流程， 这里抢问题了，应该看面试官眼色让他把缓存介绍一下）8. 做项目的初衷是什么9. post请求什么时候会出现 打印控制台，post请求出现两次的情况简单请求和复杂请求的区别options 请求遇到过吗10. axios底层？，支持node吗11. 讲一下AJAX12. 算法题：扁平数组转成树形结构问时间复杂度和空间复杂度13. 面试官小哥：我再来问你一些不相干的问题（以为可以开始扯闲话环节了，结果继续问问题）Vue中编写UI会使用 template 和 render，这两者有什么区别吗、有什么关系吗追问：不进行打包、编译可以直接使用template语法吗，render函数最终返回的是什么template最终会被编译成render，这个编译发生在什么时间?14. Vue-loader有什么作用(跟上一题有关系)15. 在webpack项目中自己随便写了一个a.abc文件，可以在js或ts文件中随便引入吗16. Vue中的nextTick，底层怎么实现的？17. 介绍一下浏览器中的微任务（自己扩展说微任务和宏任务的区别、使用场景）反问环节：1. 反问面试官求职时的心理状态、做了哪些准备2. 反问面试官有什么技术方面的书推荐3. AI风潮下，程序员的核心能力会发生转变吗？从业务能力向 AI使用 能力偏移【隔了一周多，编辑面经还在感慨，二面面试官小哥真的很nice，面试节奏特别对。要反馈有反馈、要引导有引导，表示不懂的时候还会重新解释问题，整场面试说说笑笑地进行下来了，轻松愉悦（以至于复盘的时候才发现有的问题还是有点小难的！）最后反问环节聊天也聊得很开心啊啊啊，要是二面小哥是组长就好了...可惜没有缘分。祝大家面大厂都遇到这样的面试官（接好运！）】------------------------------------------------------三面面经-5.12：1. 自我介绍2. js闭包内存泄漏原因, 降低内存泄漏风险的方法3. 自动设置垃圾回收4. weakmap5. node.js：common.js和ES module 追问Common.js的缓存机制6. script的async和defer的区别async会阻塞后续dom吗7. cookie存token和header存token有什么差别8. ES6装饰器9. decorator装饰器，普通函数不支持装饰器的原因, 高阶函数10. 回流重绘 怎么尽量降低影响（方法）11. TS枚举和定义普通对象区别12. 普通枚举和常量枚举13. type 和 interface的区别14. ts类型断言 两种方式的区别15. HTTP2.0中的服务器推送有哪些应用场景16. git相关的命令17. git pull 和 git fetch区别18. 本地分支做变更, 怎么办（回答stash暂存）19. 算法题1const [a,b] = {a:1, b:1} 能正常运行吗?为什么封装一个通用型的方法, 左右结构不动, 成功解构20. 算法题2大数相加21. 追问: 你有一个网站 包含了各种各样的静态资源, 你会怎么设置缓存策略-三面面试官应该是leader，经过我长长的自我介绍后，大手一挥说那我们开始吧！整场面试下来问题密度挺高的，苯人感觉自己答得也很不错，没有卡壳的地方。leader大人也会给一些反馈，面试整体比较顺畅~依旧是体验感不错的面试，但最后还是挂了。。。HR姐姐说面评反馈主要是算法题1思路有问题，应该是用迭代器+沟通不够简明有效得到结果后整个人都down了，非常难受哇非常......感觉像做了一场梦，二面通过的时候觉得自己很lucky，好像离字节很近了，但是结果三面出结果又离得远远的了仔细复盘了一下觉得确实还可以语言更精炼一些回答问题，整体面试还很有收获的。虽然没过，但是感恩~------------------------------------------------------四面面经-5.13：前半小时闲聊规划、学习前端原因、项目（有点不太记得了）后面四道手写题1. TS 泛型用法2. 写出数组的10个方法（写了十几个，面试官问了几个方法的用法）手写实现一个reduce3. this指向4. 给二叉树，输出二叉树每一层的最大节点- 算法题撕得不好，面得有点低气压。但是此 leader 挺活泼的哈哈哈，也会主动给出一些提示（重生之部门leader亲自教你写算法）。面试结束后就知道g了，瘫椅子上半小时没说话，才收拾收拾去吃饭了和面评反馈的一样，《可能太过紧张，心态会有点急促》。但是很感激面试官啊，哎哎哎这把确实没缘分我是不会放弃面试字节的（我节孝子一定会回来的）

过往面试题，没过1. 自我介绍2. 有没有自己做过项目3. 小红书离职原因4. HashMap底层数据结构 链表树化的条件【链表长度大于8，map容量超过64】 为什么这么设计【结合内存开销和性能考虑】 key一直有冲突，怎么办5. 介绍ConcurrentHashMap6. 说下CAS和synchronized锁的区别？7. Java的垃圾回收机制？8. 项目介绍 数据存储是单表存储的吗，表的数据上限是多少，存一个亿可以吗？ 单表超过5kw行或者容量超过2GB，考虑分库分表 订单表数据量很多，怎么做分库分表键？分库分表了解吗？ 分库解决并发量大，数据库的连接数量有限，如果分库了，用户怎么知道...

字节跳动前端二面失败面经：复盘与反思一、面试整体感受本次字节跳动前端二面的考核强度明显提升，面试官从计算机基础、CSS 知识，到 JavaScript 核心概念与实践应用层层深入，虽然最终遗憾未通过，但这次经历让我清晰认识到自身知识体系的薄弱环节。二、面试问题回顾与解析1. CS 基础与 CSS 考察• 实现父容器一半大小的正方形：我第一反应是使用 vw 单位，将子容器的 width 和 height 都设置为 50vw。但面试官的意图更倾向于基于父容器尺寸的相对计算，正确思路应该是通过百分比结合 padding-bottom 实现等比例正方形（如 width: 50%; padding-bottom: 50%;），并利用 position 或 flex 布局定位到父容器内。• CSS 盒模型：我准确回答了 标准盒模型（content-box） 和 怪异盒模型（border-box） 的区别，重点说明了 box-sizing 属性对尺寸计算的影响。2. JavaScript 核心概念与 BOM 考察• BOM（浏览器对象模型）：当被问到 BOM 相关知识时，我对 window 对象的属性（如 location、history）和方法（setTimeout、addEventListener 等）掌握不够熟练，回答较为模糊，暴露出日常学习中对浏览器环境底层知识的忽视。• 事件委托：面试官询问事件委托原理时，我错误地将其等同于事件冒泡。实际上，事件委托是利用事件冒泡机制，将子元素的事件处理委托给父元素，从而减少内存占用和提高性能。例如，在列表项点击事件中，可将点击事件绑定在列表容器上，通过判断事件源 event.target 处理具体逻辑。3. 代码实战环节• 实现 JavaScript 链式调用并支持 bind 功能：题目要求实现类似 i.initial(5).add(5).minus(3).plus(5).result 的链式调用，并能使用 bind 修改内部状态。我顺利完成了基础的链式调用逻辑，通过返回 this 实现连续调用，并维护一个内部变量记录计算结果：function Chain() {  this.value = 0;  this.initial = function (num) {    this.value = num;    return this;  };  this.add = function (num) {    this.value += num;    return this;  };  this.minus = function (num) {    this.value -= num;    return this;  };  this.plus = function (num) {    this.value += num;    return this;  };  this.result = function () {    return this.value;  };}但在实现 bind 功能时，由于对 bind 改变函数 this 指向的原理理解不足，未能完成。正确思路是通过 Function.prototype.bind 方法创建一个新函数，在新函数中调用原始方法，并传入绑定的参数和 this 值。• 封装安全的 React Hook：需求是处理可能失败的异步请求，并确保数据安全。我通过 useState 和 useEffect 实现了一个简单的 fetch 请求钩子，在 catch 块中处理错误，并添加了加载状态和错误信息的状态管理：import { useState, useEffect } from'react';const useSafeFetch = (url) => {  const [data, setData] = useState(null);  const [loading, setLoading] = useState(true);  const [error, setError] = useState(null);  useEffect(() => {    const fetchData = async () => {      try {        const response = await fetch(url);        const result = await response.json();        setData(result);      } catch (err) {        setError(err);      } finally {        setLoading(false);      }    };    fetchData();  }, [url]);  return { data, loading, error };};• 手写 JSONP 函数：要求传入 URL、成功回调、失败回调和超时时间。由于对 window 对象动态创建 script 标签、onerror 和 onload 事件，以及 clearTimeout 等原生方法不够熟悉，最终未能完整实现。正确实现思路如下：function jsonp(url, successCallback, errorCallback, timeout) {  const script = document.createElement('script');  const callbackName = `jsonp_callback_${Date.now()}`;  window[callbackName] = (data) => {    clearTimeout(timer);    document.body.removeChild(script);    successCallback(data);  };  script.src = `${url}&callback=${callbackName}`;  script.onerror = () => {    clearTimeout(timer);    delete window[callbackName];    errorCallback(new Error('JSONP request failed'));  };  document.body.appendChild(script);  const timer = setTimeout(() => {    document.body.removeChild(script);    delete window[callbackName];    errorCallback(new Error('JSONP request timed out'));  }, timeout);}三、总结与反思此次面试失败暴露出我在 BOM 细节、事件机制、函数绑定原理 等基础知识上的不足，以及 复杂场景下代码实现能力 的欠缺。未来准备面试时，需更深入理解 JavaScript 原型链、作用域、this 机制等核心概念，同时加强手写代码的练习，尤其是对原生 API 的熟练运用。希望我的经历能为大家提供参考，避免踩坑！

最近和一个985硕士同学聊项目，因为他们教研室主要是学术为主，加上没实习过，所以在**买了2个项目，可以看看这些号称在字节、阿里等工作过的程序员卖给学生的项目有哪些问题？项目： 一个已小说为背景的业务第一个问题： 真实的项目不可能开发这么多的模块。 这个项目又有推荐，检索，排行榜，秒杀等等模块。 而且小说推荐、排行榜、秒杀是流量最高，最复杂的业务，而该同学主要内容说的难点似乎一点都不难，该难的没难，不该难得难了。如果你在小公司上班或者实习，那么你确实有可能负责这么多模块的开发。但是一没有用户，二没有流量的公司，任何需求都不会有难点的。那面试官和你沟通什么呢？ 一眼假的项目，面试官和你沟通数据库...