news 2026/8/29 23:43:00

OPPO秋招前端笔试考点全解析:从JavaScript到浏览器原理

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
OPPO秋招前端笔试考点全解析:从JavaScript到浏览器原理

1. OPPO秋招前端笔试:整体情况与考察逻辑

1.1 一场笔试到底在筛什么

每年秋招的第一道坎基本都是笔试,OPPO前端岗也不例外。我去年投的是2023届秋招前端岗,笔试安排在投递简历后大约一周左右,形式是线上统一笔试,用的第三方平台,全程摄像头监控加屏幕录制。整套题做下来,我的第一感受是:它不像某些互联网大厂那样通篇算法题,而是更看重基础功底和工程思维的覆盖面,题目量不算小,节奏得掐着表走。

先说结论:OPPO的前端笔试主要考四个方向——JavaScript语言基础、CSS布局与浏览器原理、前端框架理解、手写代码与简单算法题。选择题占了一大半,后面跟着两三道简答题和两道编程题。整体难度属于中规中矩的校招水平,但想拿高分并不容易,因为它专门挑那些“你好像会、细想又拿不准”的知识点考,这正是很多前端同学复习时的盲区。

为什么笔试要这么设计?从我个人的理解来看,前端岗位的简历筛选之后,笔试扮演的是一个“过筛器”的角色。面试官一天要面很多人,不可能每个人都在90分钟里慢慢聊基础。笔试先把“JavaScript原型链都说不清”“CSS垂直居中只会一种方式”这类候选人筛掉,面试环节才能集中精力考察项目经验、技术深度和沟通表达。换句话说,笔试成绩很大程度上决定了你能不能见到面试官,而不是决定你最终拿不拿得到Offer。

1.2 题型分布与分值判断

我复盘了一下当时的题目分布,大致是这么个情况:

  • 单选题:约15道,每题2分,覆盖JS基础、浏览器API、HTTP协议、前端框架基础
  • 多选题:约5道,每题3分,难度明显比单选高,错选、漏选都不得分
  • 简答题:2道,每题10分左右,一般是写原理、说方案、对比分析
  • 编程题:2道,分值占大头,一道偏向JS手写实现,一道偏向简单算法或数组处理

注意多选题这里有个细节,多选的选项往往看起来“都对”,但其实藏着概念性的细微差别。比如“哪些方法会改变原数组”,push、pop、sort、slice混在一起,slice是返回新数组,其他三个都会改变原数组。这种题就是典型的送命题,复习不到位,一选就错。

从分值结构能看出来,OPPO笔试的核心策略就是:选择题保住基本盘,简答题展示工程思维,编程题拿稳能拿的分。后面我会逐个部分展开讲考点和答题技巧。

2. 核心考点拆解:从八股文到工程素养

2.1 JavaScript基础:闭包、原型链与事件循环

不管哪家公司的前端笔试,JavaScript基础永远是重中之重,OPPO的题目在这方面一点也不含糊。我当时遇到的选择题里,闭包、原型链、this指向、事件循环基本各占了一到两题。

先说闭包。它考的不是定义,而是实际运行结果。比如给一段代码,让你判断输出内容,里面夹杂着for循环 + var声明的经典陷阱:

for (var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, 1000); }

问这段代码输出什么。答案是5个5,因为var声明没有块级作用域,循环结束后i已经变成5,定时器回调执行时拿到的都是同一个变量。这个考点背后其实是在考你有没有真正理解“闭包保存的是变量引用,而不是变量值”。如果改成let声明,输出就是0、1、2、3、4,因为每次循环都会创建新的绑定。

然后是原型链。笔试不会直接问你“什么是原型链”,而是给一段继承代码让你判断属性访问顺序。或者问obj.toString()能执行,是因为原型链上哪一层提供了这个方法。这类题的前提是你得把__proto__、prototype、constructor三者之间的关系搞清楚,否则只能靠猜。

再说事件循环,这个也是高频考点。OPPO的选择题里出现过类似这样的一道:给定setTimeout、Promise、async/await的混合代码,判断输出顺序。

console.log('script start'); setTimeout(function() { console.log('setTimeout'); }, 0); Promise.resolve().then(function() { console.log('promise1'); }).then(function() { console.log('promise2'); }); console.log('script end');

正确的输出顺序是script start、script end、promise1、promise2、setTimeout。核心逻辑是:同步代码先执行,微任务队列在宏任务之前清空,Promise的then回调属于微任务,setTimeout属于宏任务。

准备这类考点没有什么捷径,就是把JavaScript高级程序设计那本书里的核心章节吃透,特别是函数、对象、异步编程这几章。然后配合面经里的经典题多做几遍,做到看到代码就能在脑子里跑出结果。

2.2 CSS布局与浏览器渲染:细节里的分水岭

CSS看起来简单,但笔试里它是拉开差距的地方。OPPO考过水平垂直居中的实现方式,这个几乎每年前端笔试都有。比较稳的做法有flex、grid、绝对定位加transform,关键是要写出多种方案,并且能解释各自适用场景。

flex方案:

.parent { display: flex; justify-content: center; align-items: center; }

绝对定位方案:

.parent { position: relative; } .child { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

还有一道印象深刻的题是问BFC相关的。BFC(块级格式化上下文)这个概念,很多人复习的时候觉得抽象,但笔试就爱从“BFC能解决什么问题”这个角度出题。比如问:如何清除浮动?哪些属性可以触发BFC?我当时选了overflow: hidden、display: flow-root、float、position: absolute这几个选项。注意display: flow-root是专门为创建BFC设计的,这个选项不少同学不认识。

浏览器渲染流程也是一个重点。从输入URL到页面展示,中间经历了DNS解析、TCP连接、HTTP请求、构建DOM树、构建CSSOM树、合成渲染树、布局、绘制、合成。OPPO的简答题里就让我画过这个流程,并说明JavaScript的defer和async属性分别对渲染有什么影响。这道题其实是在考察你对前端性能优化底层逻辑的理解程度——不知道渲染流程,就无法真正理解为什么要把脚本放在body底部,为什么操作DOM要减少重排重绘。

2.3 框架题:Vue还是React,OPPO更偏爱哪个

OPPO的前端笔试在框架考察上比较务实,不会深挖源码,但会考你在实际项目里到底用没用过。我当时遇到的框架题主要是Vue方向,这跟OPPO不少业务线采用Vue技术栈有一定关系。

Vue的考点主要集中在这么几个方面:响应式原理、生命周期、组件通信、v-model的语法糖原理、计算属性和侦听器的区别。举个例子,它问过计算属性computed和侦听器watch的使用场景区别,正确答案是:计算属性适合根据已有数据派生新数据,且有缓存;侦听器适合在数据变化时执行异步操作或开销较大的操作。

再比如组件通信,笔试会直接问父组件给子组件传值用的是什么,子组件向父组件通信用什么方法。这个在Vue2和Vue3里略有不同——Vue3除了props、emit,还多了provide/inject、defineExpose等方式。

如果你准备的是React方向,也要注意,OPPO笔试不排除React题,毕竟技术栈是分部门的。React的考点大概率会集中在hooks相关的知识点,比如useEffect的依赖数组、useState的异步更新机制、useMemo和useCallback的缓存作用。我当时复习的笔试题里,React和Vue是分开的两套选项,根据自己简历里写的内容选择回答就行。这里有个建议:简历里写了什么技术栈,笔试就尽量按那个技术栈答,千万别答非所问。

框架题还有一个重要方向是工程化,比如组件库的使用与二次封装、状态管理方案的选择、路由的懒加载配置。它考察的其实是你有没有真正用框架做过完整项目,有没有遇到并解决过实际工程问题。

2.4 网络与浏览器基础:HTTP缓存与跨域,老八股文了

网络题在前端笔试里的地位一直很稳,OPPO也不例外。HTTP缓存机制几乎必考,特别是强缓存和协商缓存的对比。

强缓存有两个字段:Expires和Cache-Control。Expires是HTTP/1.0的产物,是个绝对时间,容易受本地时间影响;Cache-Control是HTTP/1.1的,使用相对时间,更靠谱。优先级别上,Cache-Control高于Expires。协商缓存对应的字段是Last-Modified/If-Modified-Since和ETag/If-None-Match,其中ETag比Last-Modified更精准,因为它基于文件内容生成指纹。

笔试里经常会出一个实际场景:第一次访问页面加载了静态资源,第二次访问时哪些请求会走缓存,哪些会重新请求服务器。如果你能答出“HTML通常不走缓存或短时间缓存,JS/CSS/图片这类静态资源走强缓存,文件名带hash时更新才生效”,这道题基本就稳了。

跨域问题也是高频考察点。JSONP的原理、CORS的简单请求和预检请求区别、代理服务器是怎么解决开发环境跨域的。OPPO考过这样一道选择题:以下哪种方式属于CORS的预检请求触发条件。答案是:请求方法不是GET/HEAD/POST,或者Content-Type不是简单的三种类型,或者请求头包含自定义字段。这道题比较细,很多人实际项目里跨域都交给脚手架代理配好了,反而忽略了原理层面的理解。

我觉得网络这块复习不用死记硬背,关键是理解浏览器和服务器之间的交互流程。你可以用一个生活化的类比来理解:强缓存就像你买菜时有个小本子记着菜价,下次直接查本子不用去菜市场;协商缓存则是你拿着旧菜价单去问老板,老板说没涨价你就接着用,涨价了你再拿新价格。

3. 实操过程与关键环节实现

3.1 笔试平台与前期准备细节

OPPO当年用的笔试平台是牛客网的在线考试系统,支持选择题、简答题和代码题。正式笔试前,系统会提前发一封邮件,里面有笔试链接和注意事项。建议提前一天做好两件事:一是确认自己的电脑摄像头能正常打开,二是把浏览器调试好。考试全程会开启防切屏监控,切出页面超过一定次数会被警告,严重的话直接取消成绩。

我当时因为电脑摄像头驱动有问题,到了笔试前半小时才手忙脚乱地装驱动,搞得心态有点崩。这种低级错误一定要避免。另外,编程题的代码编辑器不像IDE那么智能,没有自动补全,也没有语法提示,写代码需要自己在脑子里理清语法结构。如果平时习惯了IDE的辅助,建议提前去牛客网的在线编程区练几道题,适应一下原生编辑器的操作手感。

考试环境尽量选择安静、网络稳定的地方。我有个朋友考试时路由器突然断网,重连之后倒计时没暂停,白白浪费了五分钟。另外建议用Chrome或者Edge浏览器,不要用360、QQ这类第三方浏览器,有些在线笔试系统对非主流浏览器兼容性不太好,可能出现代码编辑器加载不出来的情况。

3.2 答题顺序与时间分配

OPPO的笔试总时长是90分钟,题量大概在25道左右,平均每题不到4分钟。我当时安排的时间大概是这样的:

  • 单选题最多25分钟,会做的果断选,不确定的先标记,不纠结
  • 多选题控制在10分钟以内,因为多选难度大,纠结也不一定对
  • 简答题用15分钟,每题写清楚要点,不需要长篇大论
  • 编程题留40分钟,两道题的时间分配大约是第一题15分钟,第二题25分钟

这个时间安排的逻辑是:选择题分值虽然不高,但题量大、覆盖面广,考前突击复习过的基础题尽量拿满;简答题重点在于踩点得分,不用写小作文;编程题分值最高,必须保证充足的时间,特别是需要调试代码的情况下,时间很容易不知不觉就溜走了。

编程题第一题我印象里是考数组去重和排序,难度不高,用Set加sort就能解决。但要注意的是这道题要求自己处理输入输出,不是LeetCode那种已经帮你封装好函数的形式,而是要从标准输入读取数据。很多人笔试挂在这里,不是不会写,而是不熟悉在线编程的输入输出格式。

我当时第一道编程题的解题思路是:

// 输入格式:第一行是数组长度,第二行是数组元素,空格分隔 // 要求:去重后按从大到小排序输出 function solve(input) { const lines = input.trim().split('\n'); const n = parseInt(lines[0]); const arr = lines[1].split(' ').map(Number); const uniqueArr = [...new Set(arr)]; uniqueArr.sort((a, b) => b - a); console.log(uniqueArr.join(' ')); }

这道题有几个坑:一是输入可能包含多余的空格和换行,需要trim处理;二是如果原数组长度不匹配或者第二行缺失,要有基本的数据校验意识。虽然笔试主要看核心逻辑对不对,但很多在线评测系统对输入解析错误会直接判错。

3.3 简答题的答题技巧:别只顾着堆术语

简答题看起来好写,但阅卷是有得分点的。我当时遇到的简答题之一是让对比分析Vue的computed和watch的区别和应用场景。这种题不能只写一句话“computed是计算属性,watch是侦听器”,要分层次、结构化地回答,最好用小点列出来。

我的答题思路是这样的:

  • 先说定义与功能:computed根据已有响应式数据派生新值,watch侦听指定数据的变化并执行回调
  • 再说缓存机制:computed有缓存,依赖数据不变化就不会重新计算;watch没有缓存,数据变了必然触发回调
  • 接着说适用场景:computed适合模板中需要展示的派生数据,watch适合异步操作、复杂逻辑
  • 最后可能有补充:computed不能执行异步操作,watch可以;computed是声明式的,watch是命令式的

这样四层答下来,每个小点一两句话,得分点基本就都覆盖了。

还有一个心得是写简答题的时候不要堆砌一堆术语而不解释。比如你写“computed基于响应式依赖缓存”,阅卷人可能会想知道你理解不理解“响应式依赖”是什么意思。用一句通俗的话补充解释一下,“比如模板里用到的数据没变,computed就不会重新执行函数”,反而比堆一百个名词更能证明你真的懂。

4. 常见问题与避坑指南

4.1 笔试中的典型失误与排查技巧

我在这次OPPO笔试以及后来陪同学模拟训练的过程中,总结出了几个高频翻车点,整理成了一张速查表,希望后来的人别再踩同样的坑。

问题类型具体表现正确的处理思路
多选漏选明明知道有两个正确选项,怕选错不敢选满只要不确定的选项不选,确定的一定要选。多选错选不得分,但漏选也不得分,保险策略是“只选最有把握的”
编辑环境不适不习惯在线编辑器,缩进乱了,或者自动补全失效提前用牛客网在线编程多练手,养手动写括号和缩进的习惯
输入输出格式错误编程题本地逻辑正确,提交后莫名报错先打印解析后的输入数据,确认格式没问题再做题
时间分配失衡选择题纠结太久,导致编程题没时间给自己设定死线,超过时间直接标记跳题,完成全部再回来
切屏误触不小心点击浏览器地址栏被警告开考后不要切出考试页面,全部操作留在页面内进行

多选漏选这个问题值得展开说。很多同学在多选题上吃过亏,包括我自己。多选的评分标准通常是不定项选择,错选、漏选、多选都不得分,只选对一部分也没有半分。所以策略是:你只能确定两个选项是对的,那选两个就够了,不要因为觉得“其他选项好像也对”就加选。宁可少拿一道题,也尽量不要因为加选而白丢一道题。

4.2 备考时间线:从零到笔试的复习规划

最后分享一下我备考前端笔试的时间安排,这个节奏适用于有一定前端基础、但还没有系统复习过的同学。时间大概是三周到一个月:

第一周做基础摸底,建议直接找一套去年OPPO或其他厂商的前端笔试题做一遍,计时90分钟,做完再对答案。这一步的目的不是得分,而是定位你的知识薄弱点。我当时做摸底题时才发现自己事件循环和浏览器缓存这块完全是一团浆糊,如果直接闷头复习,大概率会在这些地方浪费时间。

第二周集中刷JavaScript和CSS基础题,配合面经里的高频考点逐个过。JavaScript重点复习闭包、原型链、this指向、事件循环、ES6新增特性;CSS重点复习flex、grid、BFC、水平垂直居中、选择器优先级。

第三周转向框架和网络。框架部分以自己常用的那个为主,Vue就重点看响应式原理、生命周期、组件通信、computed和watch;React就重点看hooks、组件通信、虚拟DOM。网络部分重点看HTTP缓存、跨域解决方案、HTTPS握手过程、TCP三次握手四次挥手。

最后几天做模拟笔试。找完整时间段,用牛客网或者赛码网的模拟题练手。模拟的时候一定要开计时器,严格按照考试状态来。我当时模拟了三次,前两次都是时间不够用,到第三次才摸清了自己的答题节奏。

4.3 一些值得补充的进阶考点

OPPO的笔试题整体偏基础,但如果你有精力,以下几个进阶考点也建议提前了解一下,因为它们偶尔会出现在选择题里,而且面试环节被追问的概率很大。

第一个是浏览器渲染性能优化。除了常见的减少重排重绘、懒加载、图片压缩之外,可以关注一下CSS contain属性、content-visibility这类相对新的优化手段。第二是前端工程化,比如Webpack的打包流程、Loader和Plugin的区别、Tree Shaking的原理。第三是微前端,如果简历上写过微前端项目,笔试里可能会出现qiankun、single-spa之类的概念题,主要是考察你对微前端隔离方案的理解。

还有一个容易被忽视的是HTTP/2和HTTP/3的对比。笔试如果问“HTTP/2相比HTTP/1.1有哪些改进”,多选选项通常包括多路复用、头部压缩、二进制分帧、服务端推送。注意服务端推送不是主动推送数据,而是服务器在客户端请求HTML时预先推送JS/CSS等资源。这个点容易理解偏。

4.4 笔试结束后:复盘比分数更重要

笔试做完不是结束,而是另一个开始。我强烈建议在笔试结束后48小时内做一个复盘,趁记忆还热,把当时不确定的题目整理出来,逐个查清楚正确答案和背后的原理。

我当时整理了一份自己的笔试错题集,记录了大概十来道题。后来面试的时候,有几个问题正好就是我笔试时没弄懂的知识点,因为复盘过,所以答得比较流利。笔试和面试本来就是连贯的考察过程,你在笔试中暴露的薄弱项,面试官在简历里、在面试追问中很可能还会碰到。

复盘时怎么整理错题?我常用的格式是三列:题目考了什么知识点、我当时是怎么想的、正确答案的完整解释是什么。不用抄原题,只要看到关键词就能回忆起来就行。我自己用了Notion建了一个前端面试知识表格,按JavaScript、CSS、框架、网络、工程化五个维度分类,每周末过一遍。这个习惯坚持到秋招结束,对我的帮助非常大。

最后分享一个心态层面的建议:秋招的笔试机会很多,OPPO只是其中一站。就算这次笔试发挥不理想,也不要过度沮丧。每一次笔试都是在帮你熟悉节奏、补充盲区。保持复盘、保持输出,你会在接下来的笔试中越来越有手感。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/8/29 23:41:41

MOS管体二极管在电源防反接与自动切换电路中的核心应用

1. 项目概述&#xff1a;从“烧板子”到“不断电”的电源守护者搞硬件开发的朋友&#xff0c;尤其是做嵌入式或者小家电、IoT设备的朋友&#xff0c;十有八九都踩过“电源反接”这个坑。新做的板子&#xff0c;满怀期待地插上电源&#xff0c;只听“啪”一声轻响&#xff0c;或…

作者头像 李华
网站建设 2026/8/29 23:40:15

前端校招笔试全解析:从JavaScript闭包到工程化实战

2023年小满春招第三批笔试&#xff0c;这四个字放在一起&#xff0c;信息量其实不小。“2023”意味着春招彻底恢复了线下节奏&#xff0c;岗位竞争烈度比前两年明显回暖&#xff1b;“第三批”则更直白——前两批已经筛过一轮人&#xff0c;到第三批笔试时&#xff0c;剩余的候…

作者头像 李华
网站建设 2026/8/29 23:38:52

STM32MP157未使用DSI与ANA引脚处理:悬空危害及软硬件方案

1. 先从引脚本身说起&#xff1a;DSI和ANA在STM32MP157FAC1里扮演什么角色STM32MP157FAC1是意法半导体STMP15x系列里非常有代表性的一颗异构处理器&#xff0c;双核Cortex-A7负责跑Linux或Android之类的上层系统&#xff0c;Cortex-M4则用来处理实时控制任务。这种架构在工业HM…

作者头像 李华
网站建设 2026/8/29 23:36:05

2023哔哩哔哩前端校招笔试题拆解:考点分析与备考指南

2023哔哩哔哩前端校招笔试题拆解&#xff1a;这套卷子在考什么&#xff0c;以及如何系统性备战前端开发领域的校招笔试题年年都在变&#xff0c;但底层逻辑始终是那几件事&#xff1a;语言基础扎不扎实、工程化思维有没有建立、遇到实际场景能不能把解决方案落到代码层面。今年…

作者头像 李华
网站建设 2026/8/29 23:34:49

OpenAI WebMCP挑战赛:从MCP到AI代理的Web标准化之路

最近技术圈里一个值得注意的信息&#xff0c;是 OpenAI WebMCP 挑战赛启动直播预告。很多人可能会把它当成一场普通的比赛公告&#xff1a;定个时间、讲几句赛制、放个报名入口&#xff0c;就结束了。我的看法不太一样。OpenAI 在这个时间点推出“WebMCP”这个概念&#xff0c;…

作者头像 李华
网站建设 2026/8/29 23:25:17

Java校友管理系统实战:Spring Boot+MyBatis架构设计与核心模块实现

简介&#xff1a;信息管理系统是现代企业级应用开发的核心领域&#xff0c;其本质是通过软件技术对业务数据进行高效、安全的增删改查&#xff08;CRUD&#xff09;与流程化管理。其技术原理通常基于经典的三层架构&#xff08;表现层、业务逻辑层、数据访问层&#xff09;&…

作者头像 李华