6435 字
32 分钟
字节跳动 - 前端面试笔记
2026-08-08
面试
全部笔记
/
面试

一、自我介绍#

面试官您好！我叫刘惠安，现在就读中山大学软件工程学院，目前大二，这次来面试的岗位是国际化广告平台前端开发实习生。

现阶段我主要深耕算法基础以及软件工程相关知识，平常坚持刷算法题锻炼编码思维；前端属于我本学期着手入门学习的方向，基础概念已经有所了解，后续我会投入时间快速补齐岗位需要的前端技能。

在校时间我完成过几个编程项目，我主要承担核心代码编写、功能调试以及 BUG 排查的工作，平常独立做过 Qt、C# 管理系统项目，也积攒了不少调试经验。本学期我运用学到的前端知识，搭建了个人博客网站。最开始从 GitHub 克隆了 Astro 开源博客框架作为基底，之后自主进行定制改造。在做项目的过程之中养成了自主排查 bug、自学技术文档、还有和ai交流的习惯。

我平时喜欢钻研代码，能够沉下心钻研技术，学习接受速度比较快，也认同字节的奋斗文化。如果能够获得这次实习机会，我愿意从基础任务做起，尽快熟悉团队业务、补齐前端知识体系，踏实完成分配的工作。

我之前阅读过岗位信息，对字节和这个岗位做的事都非常感兴趣，所以很荣幸今天能够有这么一个交流的机会。希望咱们今天沟通愉快~

二、在校学习类问题#

  1. 你现在大二，专业课都学了哪些？哪一门你学得最好？

现阶段修读过 C/C++ 程序设计、各类公共数学课程、大学英语；专业核心课包含数据结构、计算机网络、操作系统、计算机组成原理。 几门专业课里面我最为擅长数据结构，平时也一直在 LeetCode 刷题巩固，算法思维算是我的长处，前端相关课程暂时还没有深入学习。

  1. 平时学业压力怎么样，假如之后来实习，可以保证出勤时间吗？

课业压力尚可，我已经规划好了时间。上课和实习时间能够错开，每周可以保证四天到岗，可以稳定投入工作，日常课业不会耽误实习任务的进度。

  1. 为什么大二就着急出来找实习？

在校课程大多偏向理论知识，缺少真实业务的开发经验。我希望提早进入企业项目，亲身感受团队的开发模式，同时补齐前端方面的实操经验，锻炼工程动手能力。

  1. 你的绩点如何？如何看待成绩？

我的绩点四点出头，专业排名处于前 20%~50% 区间。 我认可课业成绩能够检验基础知识，但相比纸面分数，我更看重代码实操能力，课余大部分空余时间用来刷算法题、独立编写各类练习项目。

  1. 学校有没有组队做过课程大作业？你在团队里面负责什么？

有进行过课程小组作业。在团队之中我主要承担核心代码编写、功能调试以及 BUG 排查的工作，平常独立做过 Qt、C# 管理系统项目，也积攒了不少调试经验。

  1. 平时在学校会怎样安排自己每天的学习时间？

我的时间安排比较灵活。上完课程之后，我会拆分空余时段，一部分用来巩固专业课，剩下的时间练习算法题、钻研新项目，最近分出一部分精力入门前端基础知识。

  1. 除上课之外，平时自学哪些技术？

日常最主要的就是刷算法题目，训练自己的数据结构思维；近期刚刚开启前端基础的学习，从零熟悉原生前端相关知识。

  1. 有没有参加过竞赛？收获是什么？

有参加过程序类竞赛。竞赛主要带给我实战做题的经验，训练了我面对题目快速思考、调试代码的能力，也让我意识到算法基础对于程序员十分关键。

  1. 你软件工程专业，为什么选择投递前端岗位？

软件工程方向覆盖面很广，我希望接触可视化页面开发。字节国际化广告平台的业务很吸引我，我愿意从零起步深耕前端，在岗位当中积累业务开发经验。

  1. 专业课当中哪一块学得最吃力，你怎么攻克？

我当初感觉操作系统这门课程难度偏高，概念抽象不容易吃透。我的解决方式是反复翻看课本，查找网上通俗的讲解，动手整理思维导图，遇到难懂的知识点就拆分成分块，一点点消化理解。

  1. 在校有没有担任学生职务，做过哪些事务？

我现在是班里的组织委员。平时主要负责对接党组织相关通知，落实好班级相关党务工作，协助通知同学各类事项，做好班级的联络工作，这段经历也锻炼了我的沟通能力。

  1. 之后大三的规划是什么，实习之后打算深耕前端吗？

大三我有考研的备选计划，最后的决定也会参考本次实习的体验。 如果这次实习收获不错，我会好好深耕前端方向，积累工程能力；不管后续选择哪条道路，企业实战经验对我而言都十分宝贵

三、求职、性格、情景问题#

  1. 你为什么选择字节跳动，为什么选择广告平台前端岗位？

首先我很认同字节“和优秀的人，做有挑战的事”的理念，其次字节在互联网行业的技术氛围很好，很看重工程师基础能力，尤其算法和工程实操，非常适合我现阶段积累实战经验。 至于国际化广告平台方向，我认为广告业务十分看重前端页面展示、数据看板、海外端适配，业务场景丰富。我希望借着前端岗位接触商业化业务，同时锻炼自己的编码能力，因此投递该岗位。

  1. 你了解国际化广告平台是干什么业务的吗？

我的理解是平台面向海外广告业务，主要服务广告投放、数据看板、投放参数配置、投放效果的数据展示，依靠前端页面给到运营和产品人员可视化的操作后台。 我清楚这一岗位需要适配海外业务场景，后续入职之后我会仔细熟悉完整业务流程。

  1. 你现在前端基础薄弱，准备怎么补齐短板？

我会规划好分阶段补齐。 第一阶段，先吃透岗位刚需的原生 JavaScript、页面布局这些基础知识，可以应付日常基础开发； 第二阶段，跟着团队的业务代码阅读项目源码，熟悉团队技术栈、代码规范； 平常空闲时间我会整理笔记，遇到不懂的地方查阅官方文档，向前辈请教。 我本身刷题、做项目的自学习惯不错，可以较快跟上进度。

  1. 实习之后交给你的都是简单琐碎的基础工作，你可以接受吗？

我完全能够接受。我现在只是大二学生，本身缺少企业项目经验，琐碎的基础任务也是熟悉项目结构、代码规范、业务流程最好的途径。 我会认真对待每一件基础任务，保证交付质量，在做事的过程当中观察成熟工程师的写法，慢慢积攒经验，之后再承担更加复杂的工作。

  1. 如果团队里面交给你的任务你不会，你怎么处理？

第一步先梳理清楚任务需求，自己先查阅文档、搜索资料，独立尝试思考可行方案； 经过自己钻研之后依旧卡住，我会整理清楚自己卡在哪一处，带着自己的思路和疑问再去请教带教同事，不会一碰到难题就直接发问。 做完任务之后我会做好复盘笔记，避免之后重复踩同类问题。

  1. 和同事意见不一样的时候你如何处理？

我会先耐心听完对方完整的想法，对比我们两个人方案各自的优缺点； 一切以业务需求、代码可维护性、性能作为判断标准，不带入主观情绪。 要是我思路有疏漏就接纳对方合理建议；如果我有可行的依据，就清晰说出我的考量，最后和带教同学商议选出最合适的方案。

  1. 平常写代码到深夜，能否承受高强度的工作节奏？

我平时在校准备算法刷题、独立编写项目的时候，也经常会为了调试程序投入较长时间，可以适应高强度的工作节奏。 我能够保证上班期间专注投入，遇上业务繁忙的时候配合团队进度；同时我也会合理规划时间，保持自己的效率。

  1. 你有什么缺点？

目前我的短板主要在于前端整套工程化相关知识储备不足，Vue、打包工具这类内容我才刚刚开始接触。 不过我已经开始从零起步学习前端基础，后续实习期间跟着项目实操，尽快补齐这块短板。

  1. 你的优势是什么？
  • 第一是算法基础，我一直在坚持刷 LeetCode，具备基础的数据结构与算法思维；
  • 第二是喜欢自主折腾项目，之前独立写过好几款应用软件，习惯独立排查各类 Bug；
  • 第三自学能力和耐心比较充足，碰到陌生技术愿意查阅外文文档，能够沉下心适应新的技术栈。
  1. 之后可以接受短期紧急赶需求吗？

我可以接受短期紧急的需求。我明白互联网项目偶尔会有上线、迭代的时间节点，遇上紧急任务我会优先配合团队进度，调整自己的时间，保质保量做完手上任务。

  1. 实习期望收获什么？

首先希望熟悉国际化广告平台真实的业务逻辑，了解企业级前端项目的代码规范和开发流程； 其次把在校学到的算法基础落地到真实业务当中，补齐我的前端技术短板； 最后学习团队工程师处理问题的思路，养成工业级的开发习惯，为之后的技术发展积累经验。

  1. 你平时怎么缓解压力？

当刷题或者开发项目压力比较大的时候，我会短暂停下代码，稍微放松一会，整理一遍现在卡住的问题。 平时空闲也会出门走动，调整精神状态，休息结束之后重新梳理问题，冷静地分步解决难题，不会被焦虑影响状态。

  1. 有没有同时投递别的公司？

近期有少量投递，但是我最心仪的就是字节这边的实习机会。比起单纯拿到一份实习，我更加看重业务平台质量和团队氛围，所以现在重心都放在本次面试准备上。

  1. 面试结束你有什么想问我的？（三选一，推荐第一个）
  1. 如果我顺利通过面试，实习生刚入职前期主要需要熟悉哪些业务或者技术栈？
  2. 咱们前端实习生日常主要负责哪一类开发任务？
  3. 对于大二零基础入门前端的实习生，您这边有什么学习上面的建议？

避雷小结#

只要问到 Vue、Webpack、前端手写难题，统一话术： “这块我现阶段只是简单听说，目前前端刚入门，之后进入实习我会结合业务代码系统学习。“

四、项目开发类问题#

  1. 介绍一下你印象最深的一个项目

我印象最深的是我独立搭建的个人博客网站。最开始从 GitHub 克隆了 Astro 开源博客框架作为基底，之后自主进行定制改造。 整套站点拆分为两大板块，一块用来当做日常博客，存放我的出游游记、日常随笔；另一部分改造为专属笔记站点，用来收纳我备考 408 整理的专业课笔记、学习感悟。开发全程我学会 HTML、CSS、Markdown 语法，中途最难的任务便是接入评论区功能，攻克难题之后我还把这次排坑心得记录到我的笔记站点当中。代码依靠 GitHub 做版本管控。

  1. 当初你为什么想要做这个项目

我平时喜爱记录生活，经常会外出游玩，希望有一处专属站点存放游记和日常随笔。 之后我备考计算机考研 408 科目，平时积攒了大量学习笔记，纸质笔记不方便随时查阅。于是我萌生想法，改造一份相同框架搭建笔记站，线上存放学习资料，方便随时随地翻看复习，因此着手搭建这个项目。

  1. 整个项目你一个人完成还是多人协作？你的角色？

项目由我一个人独立完成。我承担全部工作：框架初始化、页面定制、功能增减、bug 调试、版本管理、后期内容维护，全程由自己规划需求和开发节奏。

  1. 项目当中用到了哪些技术，为什么选用该技术？

用到 Astro、HTML、CSS、Markdown，使用 GitHub Git 管理代码。 选择 Astro 框架有三点理由：

  1. Astro 主打静态站点，博客、笔记网站属于静态页面，不需要很重的前端框架，加载速度很快；
  2. 框架原生就支持 Markdown 文档，非常适配我书写笔记、随笔的需求；
  3. 网上成熟的开源模板较多，文档完善，对于刚入门前端的我上手门槛更低。 我没有选用 Vue Press 这类工具，是因为它框架偏重，而我只需要简洁轻量化的静态博客工具。
  1. 开发期间遇到最难解决的 bug 是什么？

最难的就是新增评论区功能。最开始照搬网上教程接入评论组件之后，出现组件渲染异常、页面布局错乱，部分页面加载之后评论模块直接无法显示，折腾很久才调试完毕。 解决之后我将整个踩坑流程整理成学习笔记存放在笔记站点，方便之后复盘。

  1. 调试问题的时候你的排查步骤

第一步先观察报错信息，查看浏览器控制台的报错； 第二步定位是布局样式问题还是组件加载的问题，先单独拆分评论组件进行测试； 第三步翻阅 Astro 官方文档、搜索相关问题； 多次尝试无果之后借助 AI 排查我代码当中疏漏； 最后一点点修改参数，反复刷新页面测试，直到功能正常。

  1. 项目有哪些不足之处，如果现在重做你会怎么优化？

现存缺点

  1. 很多功能只是照搬模板修改，对于 Astro 底层原理理解比较浅显；
  2. 移动端适配做得比较粗糙；
  3. 评论区功能较为基础，缺少消息提醒、评论分页；
  4. 文件管理比较杂乱，没有严格拆分静态资源、配置文件。

重做优化方案

  1. 整理项目目录结构，规范文件夹分类；
  2. 完善移动端屏幕适配；
  3. 升级评论模块；
  4. 抽出空闲时间深入看懂模板源码，而不是单纯修改表层配置。
  1. 有没有使用 Git 管理你的项目代码？日常怎么操作？

有，全程依靠 GitHub 管理代码。 日常流程：本地修改代码之后 git add 添加文件、git commit 提交备注、git push 推送至远程仓库；如果需要尝试新功能，后续我也可以新建分支进行试验，防止主干代码出错。

  1. 项目的数据从哪里来，怎么处理数据？

站点所有内容都是我自己产出：游记、日常随笔、408 各科学习笔记。 我使用 Markdown 编写文档，Astro 框架能够直接解析 md 文件渲染成网页，我只需要做好文档分类，划分博客文件夹和笔记文件夹即可。

  1. 在写代码的时候你会注重代码规范吗？平时怎么规范命名？

我有留意基础的代码规范。文件夹、文件名称全部采用易懂的英文名称；CSS 类名见名知意；配置项按照功能分区。 因为是个人项目，前期规范相对宽松，做完这个项目之后，我现在意识到命名规范的重要性，后续开发会更加留意。

  1. 开发过程有没有参考外文文档？

Astro 拥有海外官网，同时配有国内中文版本文档。遇到难懂的配置时我优先浏览中文文档，部分中文资料讲解简略的时候，我便查阅原版外文官方文档寻找说明，也锻炼了我阅读技术文档的能力。

  1. 做项目时卡很久没有思路，你会怎么办

首先反复查看官方文档，核对参数配置；接着上网搜索同类开发者遇到的同款问题；自己分段注释代码、缩小出错范围；长时间卡住之后就借助 AI 指出我的代码隐患； 问题解决之后，我会记下这次踩坑点，写到我的笔记网站，防止之后重复犯错。

  1. 有没有尝试过多版本迭代、新增功能？

存在迭代。初始版本只是单纯的博客站点；后续复制框架、二次改造新增独立笔记站；后期又追加评论区功能，中间也多次调整页面样式、排版，持续进行微调优化。

  1. 你的项目可以解决什么实际需求？
  • 第一，承载我的旅行随笔、日常生活记录；
  • 第二，线上存放 408 的学习笔记，不受纸质书本约束，任何时候浏览器就能够查阅；
  • 第三，我可以将自己开发项目的踩坑心得保存进去，充当我的技术知识库。
  1. 对比网上现成的程序，你的项目优势在哪
  1. 完全贴合我个人的使用需求，分为博客区和学习笔记区，是定制化的双站点结构，普通开源模板大多只具备单一博客功能；
  2. 所有学习踩坑记录都沉淀在站内，属于我专属的知识库；
  3. 在改造途中我没有直接照搬全套功能，按需删减不需要的插件，网站整体更加轻量化。
  1. 做完项目之后你的技术上面获得哪些成长
  1. 入门熟悉 HTML、CSS、Markdown 语法，初次接触前端静态站点框架；
  2. 熟练掌握 Git、GitHub 的基础版本控制操作；
  3. 学会查阅中英文官方文档、独立排查前端页面 bug；
  4. 养成了记录开发踩坑笔记的习惯；
  5. 明白了搭建项目先理清自身需求，再挑选适配框架的思路。

专属避坑提示#

面试官如果继续深挖 Astro 原理、打包机制、前端渲染原理这类深度问题，直接使用固定话术： “我当时主要基于模板进行功能改造，框架底层原理目前还没有深入研究，如果顺利入职之后，我会借着岗位的前端项目系统深耕相关知识。“

五、前端 & 技术基础问题#

  1. HTML 和 HTML5 新增标签有哪些你清楚吗

普通 HTML 常用标签像 div、p、span、a、ul li 这些； HTML5 新增了语义化标签，例如 header、footer、nav、section、article，相比普通 div，可以让标签具备语义，利于可读性和搜索引擎识别，其余新增标签我只做过简单了解。

  1. 行内元素、块级元素区别
  1. 块级元素独占一行，可以设置宽高，例如 div、p；
  2. 行内元素不会独占一行，横向排布，无法直接设置宽高，代表有 span、a；
  3. 还有行内块元素，可以同行摆放并且自定义宽高，像 img。
  1. CSS 盒模型是什么

盒模型决定元素占用的空间，从内向外依次是 content 内容、padding 内边距、border 边框、margin 外边距。 分为标准盒模型和 IE 怪异盒模型；标准模式宽高只代表 content，怪异模式宽高包含 content+padding+border。

  1. Flex 简单属性你了解多少

我清楚 flex 弹性布局，可以很方便完成页面元素排布。 常用父容器属性有 display:flex、justify‑content 主轴对齐、align‑items 侧轴对齐； 子项了解 flex‑grow、flex‑shrink，现阶段只掌握这些最基础的用法。

  1. var、let、const 的区别
  1. var 存在变量提升，函数作用域，可以重复声明；
  2. let 和 const 具备块级作用域，不存在变量提升，不能够重复声明；
  3. let 可以修改变量的值；const 用来声明常量，基础数据类型不可修改。
  1. JS 闭包是什么，简单举例子

闭包就是内层函数访问外层函数作用域当中的变量，外层函数执行结束之后，它的变量依旧可以被内层函数保留。

function outer(){
    let num = 1;
    return function inner(){
        console.log(num)
    }
}
let fn = outer();
fn()

好处是可以保存私有变量；缺点是容易造成内存占用。

  1. 原型和原型链

每一个函数都会自带 prototype 原型对象；实例对象有 __proto__ 指向构造函数的原型。 原型链就是实例顺着 __proto__ 向上一层一层查找原型，构成的查找链条，访问属性的时候逐层向上搜索直到 null。

  1. JS 异步有哪几种处理方式

回调函数、定时器、Promise、async await、生成器 generator，还有浏览器的事件监听。日常我主要了解回调以及 Promise。

  1. Promise 的基础作用

Promise 专门用来处理异步任务，可以解决回调地狱的问题；有 pending、resolved、rejected 三种状态，可以通过 then 链式调用处理异步成功和失败之后的逻辑。

  1. 有没有接触过 Vue？学到哪一步了？

最近刚开始入门前端，仅仅简单浏览过 Vue 基础概念，还没有深入搭建项目，实习之后我会抓紧系统学习。

  1. 前端页面加载的全过程

首先 DNS 解析域名获取服务器 IP；之后建立 TCP 连接；浏览器发送 HTTP 请求；服务器响应并且返回 HTML 资源；浏览器解析 HTML，生成 DOM 树和 CSSOM 树，合成渲染树，接着布局、绘制页面，途中加载脚本、图片等资源。

  1. 什么是跨域，简单说下成因

同源协议、域名、端口三者只要有一项不一样，就属于不同源；浏览器出于安全的同源策略，会阻止不同源之间发起请求，于是就出现跨域限制。

  1. 平时刷算法刷到什么程度、大概刷了多少题？

目前 Leet Code 主要刷热题 100 当中的简单题目，现在已经完成十几道。我现阶段重点练习数组、哈希、链表这类基础题型，保证基础题能够手写出来，也是这次面试最主要准备的内容。

  1. 你最喜欢哪一类算法题型（数组、哈希、双指针等）

我比较偏爱哈希表和双指针类型的题目，思路直观，适合处理数组查找、去重、比对元素这类场景，上手的时候相对顺手。

  1. 手撕算法卡住的时候你一般怎么思考？

首先我会先用暴力解法实现一遍，先保证能够得出结果；之后观察暴力解法哪里存在重复运算，思考可不可以借助哈希、双指针降低时间复杂度； 如果长时间没有头绪，我会列举几组测试用例手动推演寻找规律；实在卡住之后我会向面试官说明我现在的卡点，寻求一点提示。

前端答题通用兜底话术#

一旦问到生命周期、webpack、节流防抖、深拷贝、组件通信这类进阶考点： “目前我只停留在前端基础阶段，这类进阶知识还没有仔细钻研，后续进入实习之后我依托项目代码进行学习。“

应试小贴士#

  1. 所有回答点到即止，说完基础定义之后不要主动延伸；
  2. 面试官继续深挖就启用兜底话术，委婉表明现阶段只是入门；
  3. 把话题重心往你的算法刷题、独立项目上面引导。
字节跳动 - 前端面试笔记
https://github.com/posts/字节面试/
作者
纸船
发布于
2026-08-08
许可协议
CC BY-NC-SA 4.0
企业级网络架构与组网实验核心总结
© 2026 纸船. All Rights Reserved. / RSS / Sitemap
Powered by Astro & Fuwari