#我的失利项目复盘#1. vue router如何监听路由改变事件2. vue router是如何调用生命周期的钩子函数的，监听路由改变事件的一定是一个对象吧，这个监听的对象是？3. 项目中使用了mitt Event-mitter库，里面的实现原理是？（订阅者和消费者模式），手动实现一下该模式和事件总线？4. 手动实现JS queue并写BFS5. 知道JS里能用到队列queue的情况吗，还有栈stack呢？（并发请求，路由 etc.）6. TS，1. 自动推断数组内的联合数据类型 |2. 有一个函数，参数a是任意对象，参数b的类型一定是参数a属性（x, y）中的一个，TS类型推断怎么写7. 你项目里角色，用户，权限三者的模型了解过吗？怎么设计的？鼠鼠我还是太菜了，面的汗流浃背了

一面1.自我介绍2.做系统重构的背景是什么？3.统一表单系统后配置项减少40%是怎么做到了？4.排班打卡减少了不必要的页面的重定向是怎么做的？5.做了一个组件库，这个组件库是给谁用的呢？6.哪些适合封装成一个公用组件，封装为一个公用组件他应该具备哪些特质？7.简单介绍下GitHub Actions。只用过但是没有深入了解8.css中有哪些定位的方式？9.css3的新特性10.简单说一下什么是回流和重绘？什么场景下会触发回流和重绘？11.介绍下什么是BFC12.js有哪些数据类型？13.基本数据类型和引用数据类型的区别？14.堆和栈的区别？15.说下js数组方法？16.介绍下防抖和节流？17.async和await了解过吗？18.看代码说结果，事件循环。19.cookie、session Storage和local Storage之间有什么区别？20.深拷贝和浅拷贝的区别？21.手写深拷贝。反问二面1.自我介绍2.找一个之前做过的一个比较重点的项目，说一下这里面的一个设计流程和实现了哪些功能？3.项目拷打4.另一个项目拷打5.cookie、token、session的区别？6.401和403的含义？7.tcp建立连接的三次握手。为什么是三次握手？8.手写once方法9.算法：最近公共祖先反问总体来说一二面的体验还是很好的，一面面试官人很好，一些回答卡住了她还会引导重新回答出来，总体来说一面大部分都回答出来了，二面的面试官人也不错，就是对面可能信号不是那么好说着说着就卡了，后面问二面面试官有什么建议的时候，就反映说，就是在和别人沟通节奏可以放慢一点，技术方面对技术比较热情，希望继续保持。整体下来还是不错了遇到两个很好的面试官。感恩。

一、面试流程：‌面试通常包含自我介绍、‌项目介绍、‌技术提问等环节。‌自我介绍后，‌面试官会深入了解简历中所做的项目，‌包括使用的技术、‌遇到的困难及解决方法。‌技术提问可能涵盖编程语言、‌数据结构、‌算法、‌计算机网络等多个方面‌。‌面试内容深度：‌涉及基础知识的深度考察，‌如Java集合、‌多线程、‌锁等，也可能手撕代码面试氛围与感受：‌整体面试氛围较为轻松，‌面试官态度友好，‌会给予应聘者积极的回应和引导。‌答不出来也会给予提示，耐心引导，整体比较愉快二、滴滴2025届校招提前批正式启动啦！🚘岗位类别工程类/算法类/机器人类/数据类/安全技术类/产品类/运营类/职能类等🚘投递要求2024年9月~2025年8月之间毕业的海内外高校毕业生，每人可投递1个岗位🚘工作地点北京/杭州/上海/广州等🚘招聘流程简历投递-简历筛选-笔试-面试-Offer发放三、面试预约：滴滴面试采用预约制，因为面试的候选人比较多，收到面试预约邮件后尽早选择合适的面试时间，面试席位预约满后会提前关闭，就约不上啦，如果已经招到了合适的候选人，后续就不一定再约面试了，所以一定要尽早选择面试时间，如果没有什么特别的事，也尽量不要修改面试时间四、竞争比较小，进面概率较高岗位：去年秋招是前端，算法，客户端，今年HR同步之后给大家更新，不过也大差不差比较卷的岗位：后端，各个大厂后端简历量都比较多，安排起来就会比较慢，大家耐心等待吧，也可以考虑投一下客户端公司福利薪资在大厂中也算是比较有竞争力的，节假日各种礼包，桔厂周边，校招礼包，司庆礼盒少不了，速来来解锁，小零食，免费晚饭工作氛围我觉得能算得上大厂中的WLB吧，早上10点左右上班，实习生晚上6点左右走，正式员工有工作的话会稍微晚一点，整个工作氛围比较轻松，mentor也比较nice，有工作生活方面的问题可以多找mentor聊聊。身边的同事也都很不错，更重要一点，没有什么学历歧视，大家就算学校不是特别好也不用担心，滴滴也是很注重候选人个人素质的，所以好好准备🚘投递方式【内推链接】https://app.mokahr.com/campus-recruitment/didiglobal/96064?recommendCode=DScKP9qC#/jobs【内推码】DScKP9qC立刻投递，快人一步，抢跑未来全流程跟进，投递的同学评论区留言，方便后续跟进，秋招加油！ #春招#         #实习#         #校招#         #内推#         #提前批#     

面试公司：杭州某小厂面试岗位：前端这两天陆续面了两家公司，这两家公司的语气都比第一家柔和很多，难道第一家给我压力上太大了？不，肯定我是太菜了，我是菜XTUT第二份视频，第三份线下，总体答得不错，在这里继续总结答得不太好的。老样子，题目来源于公司，答案来源于ai，反思来源于自己。面试问题：【技术】1、问题：Vue 中的常见生命周期有哪些？父子组件中，他们的加载顺序和生命周期的一个关系？一般request数据获取是放在create周期还是mount周期？为什么？答案：    Vue 中的常见生命周期包括以下几个阶段：    创建阶段 ：        beforeCreate ：在实例初始化之后、数据观测 (data observer) 和 event/events 事件回调的初始化之前被调用。此时，data 和 methods 还未被初始化，无法访问到 data 中的数据和 methods 中的方法。        created ：在实例创建完成后被调用，此时 data 和 methods 已经被初始化，可以访问到 data 中的数据和 methods 中的方法，但此时页面的 DOM 还未生成。    挂载阶段 ：        beforeMount ：在挂载开始之前被调用，相关的 render 函数首次被调用，但 DOM 还未真正渲染到页面上。        mounted ：在实例挂载到 DOM 后被调用，此时 DOM 已经渲染完成，可以操作 DOM 元素。    更新阶段 ：        beforeUpdate ：在数据更新时被调用，此时数据已经更新，但 DOM 还未更新。        updated ：在 DOM 更新完成后被调用。    卸载阶段 ：        beforeUnmount ：在实例卸载之前被调用。        unmounted ：在实例卸载完成后被调用。    父子组件的加载顺序是：先加载父组件，再加载子组件。这是因为子组件的挂载依赖于父组件的挂载。在父组件的挂载过程中，会解析子组件的标签，并创建子组件的实例，然后触发子组件的生命周期。    父子组件生命周期的关系是：父组件的生命周期钩子会在子组件的相应钩子之前触发。例如，父组件的 beforeMount 钩子会在子组件的 beforeMount 钩子之前触发，父组件的 mounted 钩子会在子组件的 mounted 钩子之后触发。    一般数据获取建议放在 created 周期。因为在 created 周期中，data 和 methods 已经被初始化，可以发起网络请求获取数据，并将数据存储到 data 中。而如果放在 mount 周期，虽然也可以获取数据，但此时 DOM 已经渲染完成，如果数据获取失败或者耗时较长，可能会导致页面显示不完整或者出现加载中的空白状态。放在 created 周期可以利用 Vue 的响应式系统，在数据更新时自动更新 DOM。反思：Vue生命周期就回答了create和mount相关，甚至冒出了个“delete”，回去听录音都给自己整无语了。数据获取答对了，但是对面面试官确实没问理由，要问绝对就开猜了，还好还好。2、问题：大多数前端框架循环都用到了key，这个作用是什么？底层原理是什么？答案：    在前端框架中，key 的作用是帮助框架高效地识别和更新 DOM 元素，特别是在列表渲染时。    当使用 key 时，框架会将 key 的值作为标识符，用于区分不同的元素。在列表渲染时，如果数据发生变化，框架会通过 key 来判断哪些元素是新增的、哪些是删除的、哪些是更新的。如果两个元素的 key 相同，框架会认为这两个元素是同一个元素，只是属性发生了变化，从而进行局部更新；如果 key 不同，框架会认为是新的元素，需要重新创建 DOM。    底层原理与 Diff 算法相关。Diff 算法是用来比较两组数据的差异的算法。在前端框架中，Diff 算法主要用于比较虚拟 DOM 树的差异，以决定如何更新真实的 DOM 树。当列表渲染时，框架会为每个元素生成一个虚拟 DOM 节点，并将 key 作为虚拟 DOM 节点的属性。在 Diff 过程中，框架会通过 key 来快速定位和比较两个虚拟 DOM 树中的节点，从而找到需要更新的部分。如果没有 key，框架只能通过元素的索引来进行比较，这在列表中元素的顺序发生变化时会导致错误的更新。反思：答出了提高渲染速率和鉴别元素创建。至于比较关键的术语“局部更新”“DOM重建”确实没粘边。估计大厂会问到diff算法，提前学习下。虚拟DOM也去复习复习。3、问题：防抖和节流的定义与应用场景？实现的方式？答案：    防抖和节流是两种常用的优化高频触发事件的技巧。防抖（Debounce） ：    定义 ：在事件被触发后，在一定时间内如果没有再次触发该事件，就执行一次回调函数。如果在规定时间内事件再次被触发，则重新计时。    应用场景 ：        搜索框的自动补全：在用户输入时，如果每次输入都发送请求，会导致频繁的网络请求。使用防抖可以在用户停止输入一定时间后，再发送请求，减少网络请求的次数。        窗口大小改变：在窗口大小改变时，如果频繁触发回调函数，会导致性能问题。使用防抖可以在窗口大小停止改变一定时间后，再执行回调函数。    实现方式 ：        使用 setTimeout 函数来实现。在事件触发时，设置一个定时器，在定时器的回调函数中执行目标函数。如果在定时器执行之前，事件再次被触发，则清除定时器并重新设置。节流（Throttle） ：    定义 ：在一定时间内，只允许回调函数执行一次。如果在规定时间内事件多次被触发，只在最后一次触发时执行回调函数。    应用场景 ：        滚动事件：在滚动页面时，如果频繁触发回调函数，会导致性能问题。使用节流可以在滚动一定距离后，再执行回调函数。        鼠标移动事件：在鼠标移动时，如果频繁触发回调函数，会导致性能问题。使用节流可以在鼠标移动一定距离后，再执行回调函数。    实现方式 ：        使用 setTimeout 函数和变量标记来实现。在事件触发时，检查是否已经设置定时器。如果已经设置，则不再设置；如果没有设置，则设置定时器，并在定时器的回调函数中执行目标函数。        使用 Date 对象来记录时间。在事件触发时，获取当前时间，如果距离上一次执行回调函数的时间小于规定时间，则不执行；如果大于规定时间，则执行回调函数。反思：之前其实已经理解了相关概念，但是让自己描述确实还是描述不清楚，吱吱呜呜的，以后准备这种面试应该看着题目自己说一遍。除此之外，小厂不会考察实现，大厂应该会考察手撕，应该找时间重现。4、问题：axios, fetch, ajax 的区别？答案：    技术基础 ：axios 是基于 promise 的 HTTP 库，fetch 是浏览器原生支持的 Fetch API，ajax 是基于 XMLHttpRequest 对象的。    语法 ：axios 和 fetch 的语法相对简洁，ajax 的语法相对复杂。    支持浏览器 ：axios 和 fetch 不支持 IE 浏览器，ajax 支持 IE 浏览器。    错误处理 ：axios 提供了统一的错误处理方式，fetch 的错误处理比较复杂，ajax 的错误处理需要手动处理。    功能 ：axios 支持拦截器和自动转换数据，fetch 和 ajax 不支持。反思：其实对这块并没特别注重，感觉这边一般是封装死的，不过姑且作为知识补充。【HR】1、问题：你觉得你的项目给你带来哪些成长？答案：略反思：此处当时答得有点偏，甚至说到了什么审美提高乱七八糟的，其实应该是回答团队合作能力提高，独立开发技巧和工程化能力等等。这个回答点应该注意一下，了解对方回答的用意。总结：本次面试围绕Vue技术栈、前端基础及架构方向展开，结合面试中的表现与自我反思，总结如下：一、技术能力方面Vue生命周期与优化实践：基础生命周期能准确列举，但对父子组件执行顺序及代码实现逻辑理解不够深刻，尤其是父组件mounted执行在子组件之后的实际应用场景未能举出实例。数据获取放在created阶段的理由虽然正确，但未主动结合响应式系统原理进行展开，暴露出知识点间的联结不足。需系统梳理父子组件通信与生命周期联动机制。核心概念深度不足：对key的Diff算法原理、虚拟DOM运作机制等底层知识表述不够精准。虽然能说明key的复用优化功能，但缺乏专业术语的运用。后续需重点研读Diff算法源码解析，建立虚拟DOM更新机制的体系化认知。逻辑表达能力待提升：防抖节流虽能区分概念，但在应用场景举例时存在表述冗余。建议通过实践手写实现以巩固记忆。前沿技术视野扩展：微前端概念停留在特点罗列层面，对qiankun框架的实现原理、沙箱隔离等核心技术点认知空白。需结合官方文档搭建demo项目，深入理解模块加载、样式隔离等具体解决方案。二、综合素质方面HR环节未能精准匹配技术成长与岗位需求，体现出对面试问题核心诉求的洞察不足。未来需建立结构化回答框架，将项目经验与技术能力、团队协作、工程化思维等职业素养紧密结合。总结表明，除巩固基础外，需投入精力深入框架底层原理，提升技术表述的专业性与系统性，同时持续追踪微前端、性能优化等前沿技术方向，构建完整的知识图谱。#我的面试日记# #软件开发笔面经# #面试常问题系列#