字节前端日常实习（已oc）

字节前端日常实习已获offer，面试核心内容总结如下：

• TypeScript 类型系统

  考察点：类型体操、类型守卫、联合类型等高级特性。

  具体问题：

  unknown 与 any 的区别：unknown 是类型安全的顶层类型，需类型检查后才能使用；any 跳过类型检查，不安全。

  interface 与 type 的区别：interface 支持声明合并，type 更灵活（可定义联合、元组等）。

  类型守卫：通过 typeof、in 操作符或自定义函数缩小类型范围。

  函数类型：实现传入 string 返回 number，传入 number 返回 string 的泛型函数。

• 项目相关：JWT 鉴权与 Token 管理

  JWT 鉴权流程：客户端携带 Token 请求，服务端验证签名与过期时间。

  主动过期 Token：通过服务端维护黑名单或设置短过期时间 + Refresh Token 机制。

  Token 存放位置：

  优点：Cookie（自动携带，支持 HttpOnly 防 XSS）、LocalStorage（容量大）、Header（灵活）。

  缺点：URL（易泄露，不安全）、LocalStorage（易受 XSS 攻击）。

  预检请求（OPTIONS）：跨域时浏览器自动发送，检查服务端是否允许实际请求。

• 技术选型：NestJS vs EggJS

  选择 NestJS 的原因：基于 TypeScript、模块化设计、装饰器语法、完善的生态（如 Swagger 集成）。

  EggJS 的特点：基于 Koa，约定优于配置，适合快速开发。

• 其他技术点

  浏览器事件循环（Event Loop）：宏任务（如 setTimeout）与微任务（如 Promise）的执行顺序。

  Node.js 事件循环：与浏览器类似，但阶段不同（如 poll 阶段处理 I/O 事件）。

  V8 引擎：了解其垃圾回收机制（如分代回收）。

  手写代码：归并排序、线程池模型、sleep 函数（通过 Promise 实现）。

• Vue 2 与 Vue 3 区别

  响应式原理：Vue 2 使用 Object.defineProperty，Vue 3 改用 Proxy（支持数组监听、性能更好）。

  组合式 API：Vue 3 的 setup 语法糖，逻辑复用更灵活。

  编译优化：Vue 3 的静态节点提升（Block Tree）减少运行时开销。

• React Hooks 与执行顺序

  useState 闭包问题：依赖旧状态时需通过函数式更新（如 setState(prev => prev + 1)）。

  Hooks 执行顺序：严格按调用顺序执行，依赖项变化时重新渲染。

• 组件通信方式

  父子组件：props 向下传递，emit 向上触发事件。

  跨层级组件：Context API、状态管理库（如 Redux、Zustand）。

• 数据库对比：MySQL vs MongoDB

  MySQL：关系型数据库，强一致性，适合复杂查询（如联表）。

  MongoDB：文档型数据库，灵活 schema，适合快速迭代（如嵌套数据）。

• 手写代码与前端基础

  字符串格式化：实现类似 format('Hello {0}', 'world') 的函数。

  获取页面节点数量：通过 document.querySelectorAll 或递归遍历 DOM 树。

  Tooltip 组件：HTML + CSS 实现，涉及定位（position: absolute）与显示/隐藏控制。

  全排列算法：递归生成所有可能的排列组合。

  隐藏元素方式：display: none（不占空间）、visibility: hidden（占空间）、opacity: 0（可交互）。

• 设计模式与安全

  设计模式：单例模式（如全局状态管理）、观察者模式（如事件监听）。

  jQuery 设计模式：混合模式（兼具工具库与框架特性）。

  CSRF 防范：同源检测、Token 验证（如 CSRF Token）、SameSite Cookie 属性。

• 项目挑战与技术难点

  示例：复杂表单的动态校验逻辑、性能优化（如虚拟滚动）、跨团队协作接口联调。

• 手写代码：字符串转对象

  实现类似 JSON.parse 的功能，处理 '{"name":"Alice","age":25}' 转换为对象。

• 考察点：团队协作能力、校内经历（如社团、竞赛）、个人优势（如学习能力、抗压能力）。
• 建议：提前准备 STAR 法则（情境、任务、行动、结果）描述经历，突出与岗位匹配的特质。

• 技术准备：重点复习 TypeScript 类型系统、框架原理（Vue/React）、浏览器与 Node.js 机制、算法与手写代码。
• 项目梳理：明确项目中技术选型原因、解决的核心问题、量化成果（如性能提升百分比）。
• 软技能：展示沟通能力、学习能力、对技术的热情（如 GitHub 贡献、技术博客）。
• 面试策略：遇到不会的问题可尝试拆解或引导至熟悉领域，体现思考过程。