塔斯汀 前端实习 一面

《面试题目》

1. 自我介绍
2. 实现深拷贝
3. 深拷贝怎么解决循环引用问题
4. 怎么避免 script 标签阻塞浏览器加载
5. 项目开发中可能会用到哪些库，大概讲一下
6. 介绍一下你的低代码项目
7. 平时是怎么学习的
8. 看过哪些书
9. 怎么了解到字节跳动青训营的
10. 在青训营项目中主要负责什么
11. 在做技术选型的时候会关注什么
12. 如何保证团队去遵守代码规范，用过什么工具
13. 这个低代码项目中有没有亮点或者难点
14. 这个项目有什么优点和缺点？还有哪些地方可以改进
15. 单元测试怎么做的
16. e2e 怎么做的
17. 这个 monaco 的 vite 汉化插件怎么做的
18. 详细说一下打包优化怎么做的
19. 你想要找一家怎样的公司，为什么会选择福建，为什么会选择塔斯汀

《参考解析》

深拷贝与循环引用：基础版用递归处理对象、数组和 Date，遇到原始类型直接返回；关键是加一个 WeakMap 记录「原对象 → 拷贝对象」的映射，进入递归前先查表，命中就直接返回已建好的副本，这样循环引用（a.self = a）和重复引用（同一对象被多处指向）都能正确处理，也正是 JSON.parse(JSON.stringify()) 做不到的地方（它还会丢函数、undefined、Symbol，把 Date 变成字符串）。工程上更推荐 structuredClone（浏览器原生、支持循环引用和 Map/Set）或 lodash 的 cloneDeep，自己手写更多是考理解。再往深一层会问：要不要保留原型链、要不要处理 Symbol 键、getter 要不要触发（一般用属性描述符拷贝而不是直接赋值）。

script 阻塞与加载优化：普通 <script> 会阻塞 HTML 解析并等待执行，所以放在 <head> 会拖慢首屏。解法有：放到 </body> 前；加 defer（并行下载、按顺序在 DOMContentLoaded 前执行，适合有依赖的脚本）；加 async（下载完立刻执行、顺序不定，适合独立统计脚本）；用 type="module"（默认 defer 行为）；以及动态 import 做按需加载。配套的还有资源提示：preload / prefetch / dns-prefetch / preconnect，以及构建侧的分包、压缩、CDN。

低代码项目的亮点与不足：讲亮点要落到具体机制，比如「组件 Schema 驱动渲染 + 属性面板双向绑定 + 出码」这条链路，说明白 schema 长什么样、渲染器怎么递归、出码怎么保证可读。讲不足要真诚且带改进方向：组件生态薄（只能加组件）、复杂交互表达力不足（需要自定义代码逃逸口）、版本与协作冲突（无协同编辑、schema 冲突靠人工）、性能（大页面渲染要虚拟化、撤销重做栈要压缩）。这类「优点 / 缺点 / 怎么改」三连问是低代码项目的标准追问，答不上缺点基本等于没做过。

工程实践怎么答：代码规范用 ESLint + Prettier + Stylelint，配合 husky + lint-staged 在提交前跑，再在 CI 里兜底（本地能绕过、CI 绕不过）；命名和目录约定写进文档，评审时对照。单元测试用 Vitest / Jest，测工具函数和核心 hooks，关注边界与分支而不是覆盖率数字；e2e 用 Playwright / Cypress 跑关键链路（登录、下单、表单提交），在 CI 上跑并保留失败录屏。Vite 打包优化：manualChunks 拆包、路由级懒加载、按需引入组件库（unplugin-vue-components / babel-plugin-import）、Tree Shaking（确保 sideEffects 配置正确、避免 CommonJS）、gzip / brotli 压缩、图片转 webp 与 CDN、以及用 rollup-plugin-visualizer 看体积构成再动手。monaco 汉化插件的思路是：monaco 通过 nls 提供多语言，默认只带英文，插件在构建时把中文语言包注入并调用 monaco.editor.setLocale / 替换 nls 的加载路径，配合 vite 插件在打包阶段处理 worker 与语言资源的引用。

这一轮的特点：面试官全程围绕项目问，技术题只有深拷贝和 script 加载两道，看得出更在意「你在这个项目里到底做了什么」。回答「你负责什么」时用「我做了什么 + 解决了什么问题 + 结果」的结构，比列技术栈有效得多。作者提到面试体验好、HR 反馈及时，这类公司可以放心接流程。