小知识,大挑战!本文正在参与「程序员必备小知识」创作活动
本文已参与「掘力星计划」,赢取创作大礼包,挑战创作激励金。
前言
秋招感觉即将接近尾声了,今年的秋招可谓是风起云涌、锣鼓喧天、异彩纷呈(听说腾讯总包都40w+,流下羡慕的眼泪)。
秋招期间,我特别喜欢在牛客上看各位大佬的面经、offer等,看的不亦乐乎,每天增加一个小幻想。
前几天在看面经时,突然想到,有的题我见过很多次,有的题第一次见,现在虽说有八股文,但每年的面试行情应该都会有小的变化,要不来做个统计,粗略的估计一下今年面试市场的态势,也为自己后续的学习指一下路。
说做就做,耗费了我好几个快乐游戏的夜晚,挨着面试题,面经的复制、去重,最后精挑细选出 547 道题目,其中笔试题 200 道,面试题 357 道。
本文涉及的题目全是JavaScript方向。前端框架、计算机基础知识方向还在统计中。
笔试题部分已整理完毕,传送门: 牛客最新前端JS笔试百题
面试部分题目整理完毕,传送门: 牛客最新前端面经面试题汇总(含解析)
考点划分
本文章将 JavaScript
分为几大考点:
ECMAScript
基础(简称JS
基础):包括类型、运算符、字符串、数组、对象、函数等基础知识ECMAScript
深入(简称JS
深入):包括this
指向、原型与原型链、作用域与作用域链、垃圾回收、同步异步、事件循环等ES6
BOM
DOM
接下来我们来一起分析一下(作者是个机械狗,有可能分析的会有点生硬,希望大佬们见谅):
笔试题
题型分析
在线笔试题中程序题大多也是有选项的,但是我感觉程序题的难度是超出选择题,因此我把它单独列为一项。
笔试题有五类:单选题、多选题、填空题、程序题,简答题,下面是各类题目出现的数量:
题型 | 单选题 | 多选题 | 填空题 | 程序题 | 简答题 |
---|---|---|---|---|---|
数量 | 63 | 14 | 34 | 85 | 4 |
更直观的表现看下面饼图:
可以从上面的表格和饼图中看出:
- 重视基础:选择题、填空题比重较大,简答题的比重较小
- 重视代码能力:程序题的比重最大
程序题分析
将程序题考点笼统的分为四类:JS
基础、JS
深入、ES6
题、其他题,各类题目的数量如下:
类别 | JS基础 | JS深入 | ES6题 | 其他题 |
---|---|---|---|---|
数量 | 40 | 31 | 10 | 4 |
更直观的表现看下面饼图:
可以从上面的表格和饼图中看出:
- 程序题难度适中:基础题和深入题所占比重类似,笔试题同样注重
JS
深入部分的考察。 ES6
占比较少: 在笔试题中,ES6
考察的部分大多数与JavaScript
深入结合,例如:promise
与事件循环结合;箭头函数与this
指向结合,let/const
与作用域结合等。
考点分析
将笔试题按考点划分成:JS
基础、JS
深入、ES6
、BOM
、DOM
,具体数量见下表
考点 | JS基础 | JS深入 | ES6题 | BOM | DOM |
---|---|---|---|---|---|
数量 | 105 | 43 | 25 | 7 | 20 |
通过对考点的分析,我们可以得出:
- 笔试超级超级重视基础
JS
深入题大多出现在程序题中DOM
事件流需要重点掌握
笔试热门考点
笔试题的十大热门考点见下表:
考点 | 数量 |
---|---|
类型检测 | 22 |
类型转换 | 20 |
promise | 20 |
数组 | 18 |
字符串 | 12 |
运算符 | 11 |
作用域 | 11 |
this | 10 |
原型 | 10 |
let/const | 7 |
笔试题总结
通过对 200
道题多维度的分析,我们可以得出笔试部分的复习重点:
- 基础为神,尤其几个方面,一定要熟练掌握——原生JavaScript灵魂拷问,你能答上多少(一)
- 类型检测:
typeof/instanceof
- 类型转换:
"+", "=="
隐式转换 DOM
: 事件流- 数组: 数组方法(那些数组方法会修改原数组,那些不会)
- 字符串: 字符串方法,配合正则使用
- 类型检测:
JavaScript
深入部分的各类难点要熟知,并且能说出其大致流程,看到程序题要知道从何入手。- ES6部分以基础居多,
promise
要重点掌握
面试题
面经部分共 357
道题,题目来自阿里、腾讯、百度、字节、滴滴、拼多多、京东、B站、富途、美团、网易、小红书、有赞、快手、其他。
考点分析
依旧将考点划分为五类:JS
基础、JS
深入、BOM
、DOM
、ES6
,我们来一起看一下面试题各类考点的数量:
考点 | JS基础 | JS深入 | BOM | DOM | ES6 |
---|---|---|---|---|---|
数量 | 37 | 212 | 9 | 12 | 87 |
可见面试题部分的难度明显加大了很多,JavaScript
深入占据了总题目的一半以上,ES6
比重也增大很多,所以我们在准备面试部分时,JavaScript
深入部分的学习要重视、重视、再重视。
JS深入部分分析
将 JS
深入部分的考点进一步划分:作用域、this
、原型、垃圾回收、浏览器存储、事件循环、异步、手撕代码。
注意:手撕代码可太太重要了,当下的面试中,代码编写能力占据的比重越来越大,很多公司还会有算法题考察。
ES6部分分析
将 ES6
部分的考点进一步划分:遍历方法、箭头函数、let/const
、set/map
、promise
、proxy
、async/await
、其他
ES6
考察比较均匀,多点开花,因此 ES6
准备要全面,并且准备的深度要深,特别是一些实现原理,要做到心中有数。但记住一句话,promise
是 ES6
的真神。
手撕代码题
接下来我会罗列所有出现的手撕代码题,并指明其出现频率(从高到低)。
promise(21, 所有的公司)
: 实现一个简单的promise
、实现promise.all
等- 数组去重(13, 仅小红书、快手未找到): 你能用多少种方法实现数组去重、数组去重优化等
- 防抖(10): 防抖的作用,什么场景下使用防抖,手撕防抖等
- 节流(10): 节流的作用,什么场景下使用节流,手撕节流等
- 深拷贝(9): 深拷贝实现(考虑到函数情况、对象、数组、正则、Date)
jsonp/ajax(7)
: 手撕ajax、jsonp、jsonp/ajax
区别new(6)
- 继承(5)
- 数组扁平化(4)
- 数组函数模拟(4):
forEach、map、reduce、filter、find、indexOf
等 call/apply/bind(3)
- 柯里化(3)
- 数组乱序(2)
- 千分符(2)
"get-element-by-id"
变为小驼峰模式(2)- instanceof(1)
- 封装
cookie
方法(1) Object.create(1)
- 求嵌套数组深度(1)
- 原生模拟
class
(1)
面试题总结
代码为神
面试部分可谓是得代码者得天下,常见的手撕代码一定要熟练、再熟练,不止要会写,同时也要能说明白为什么。这将是特别大的加分项。
promise
: 重中之重- 数组去重: 多种实现方法,如果涉及到对象该怎么办?
- 防抖节流: 一定要区分开,而且要能举出例子来,不要硬背代码
- 深拷贝: 要学会实现全面的深拷贝。面试的要求和难度越来越大,因此日常复习准备时,一定要考虑所有的情况。
- ...
考察深度深,广度广
对于 JavaScript
深入部分一定要吃透,完全的吃透,特别是如下四项:
this
指向: 四种绑定(默认绑定、隐式绑定、显式绑定、new 绑定)——《2w字大章 38道面试题》彻底理清JS中this指向问题- 作用域: 预编译(函数四部曲、全局三部曲)——JavaScript之预编译学习
- 原型与原型链: 原型图一定要熟悉——JavaScript之彻底理解原型与原型链
- 事件循环: 宏任务与微任务(promise)——JavaScript之彻底理解EventLoop
重视 ES6
部分
ES6
部分知识掌握一定要全面,不要因为很多东西太难,或者日常用的不多就舍弃它,而且一定要"打破砂锅问到底",大公司不止对 ES6
感兴趣,而且对 ES6
很多部分的实现原理感兴趣,例如: async
原理,set
去重原理等。
总结
通过上面一通迷迷糊糊的分析后,如果想进入自己心仪的大公司,在 JavaScript
这里最起码要具备三点:
- 手撕代码炉火纯青
- 原生
JS
登峰造极 ES6
语法胸有成竹
后语
- 本文涉及的这
547
道题,后面我整理一下,会全部发出来,并且会挑其中我认为特别好的题目做一下分析讲解,有兴趣大佬可以关注一下 - 手撕代码部分,我会陆续都认真、完善的实现一遍。
- 目前我正在编写
JavaScript
深入系列和JavaScript
基础系列(灵魂拷问),如果大家需要可以关注我的博客。 - 本文仅涉及
547
道题,分析的结果有可能存在不准确性,仅供参考。
如果本文能有幸帮到大家,阿包甚感荣幸。
最后,预祝大家都多拿 offer
,找到心仪的工作,一起 fighting
。