字节跳动 国际化商业安全 前端 一面

《面试题目》

1. 开局三道算法题： （1）Promise 与事件循环的输出顺序 （2）合并有序数组 （3）大数相加
2. AI 相关问题： （1）日常如何使用 AI （2）当 AI 在多个代码仓库中开发时，生成的代码不符合你的想法要如何改造 （3）多 agent 相关工程问题
3. JS 八股： （1）Vue Router 底层实现 （2）new 操作符做了什么
4. 无项目环节

《参考解析》

三道手撕题的要点：Promise 与事件循环题考察「微任务优先于宏任务」——同步代码先执行完，然后清空微任务队列（Promise.then、queueMicrotask、await 之后的部分），再执行 setTimeout 之类的宏任务；async 函数在第一个 await 之前是同步执行的，await 之后的代码等价于 .then 回调，所以顺序判断的关键是把每个 await 之后的片段记成微任务。合并有序数组（力扣 88）用双指针从后往前填（原地修改 nums1、避免覆盖），或者从前往后配临时数组；注意 m/n 与剩余元素的收尾。大数相加用字符串模拟竖式：反转或从末尾遍历，逐位相加带进位，最后处理最高位进位与结果反转；要注意前导零与空字符串边界。这三题都是「看着简单、写起来容易错」的题，说明面试官在筛熟练度。

Vue Router 底层实现：核心是「监听 URL 变化 → 匹配路由表 → 渲染对应组件」。history 模式用 history.pushState/replaceState 改地址（不刷新页面），并监听 popstate 处理前进后退；hash 模式改 location.hash 并监听 hashchange。路由匹配是把配置的 path 编译成正则（或前缀树）并与当前地址匹配，得到 matched 数组（支持嵌套路由），然后通过 <router-view> 递归渲染对应层级组件。守卫（全局 beforeEach、路由独享、组件内）在导航过程中按顺序执行，配合 next() 控制流程；<router-link> 实际渲染成 <a> 并阻止默认跳转，改走 router.push。scrollBehavior 处理滚动位置恢复。

new 操作符做了什么：四步——创建一个新对象；把它的原型指向构造函数的 prototype（Object.create(ctor.prototype)）；以新对象为 this 执行构造函数（ctor.apply(obj, args)）；如果构造函数返回的是对象则返回该对象，否则返回这个新对象。手写实现就是把四步写出来，instanceof 判断与 Object.create(null) 的边界也要注意。相关延伸：Object.create 与 __proto__ 的区别、instanceof 沿原型链查找的机制、以及 ES6 class 与 function 构造函数的差异（class 不能被当函数调用、方法不可枚举、继承的 super 机制）。

AI 相关题怎么答：问「日常如何使用 AI」，现在的前端面试很爱考，好的答法是分层：查文档与 API 用法、生成样板代码与单测、解释报错、重构与代码审查辅助；同时说明边界（业务逻辑、性能调优、涉及安全的部分自己写）与验证方式（跑测试、看 diff、本地复现）。「多仓库场景下 AI 代码不符合预期怎么改造」要答到具体手段：把跨仓库的约定与接口契约写进规则文件、只给相关仓库的相关文件作为上下文、先让它输出设计方案再确认、用接口契约测试保证跨仓库一致性，必要时拆成「改哪个仓库」的子任务串行执行。「多 agent 工程问题」可以答任务划分（按仓库或按模块切分）、共享上下文的传递（约定文件与接口定义）、冲突处理（各自分支 + 人工合并）、以及成本与可观测性（每步留轨迹）。

这一轮的教训：作者总结「还是算法刷少了，AI 还是用少了」。字节的前端面试算法权重不低（三道题一题没写出来基本就结束了），所以不管简历多好，手撕必须先过关；同时「AI 使用经验」已经成为前端面试的固定考点，准备时要把自己用 AI 的真实流程整理成一个能讲两分钟的故事。