非科班出身字节跳动前端offer,我有一份50000字面试宝典分享给你!

个人经历

本人211学校,回想我大一的时候,读的是机电工程,因为对计算机专业好就业比较看重,后来在大一下的时候开始了自己双学位之路,开始了学计算机专业,从此开始了科班生的生涯。接触前端也大概是在大一下学期,在一个叫腾讯课堂的地方偶然发现了一套 JS 的视频,看着感觉不错,想深入这个领域,但后来发现越往后面学越需要一些计算机科班的专业基础,于是我当时果断转到了计算机。因此这一步选择算得上偶然,也是一个必然。

大二上学校的课程压力比较大,不温不火地学了一个学期,中途有过做全栈的想法,报了个 Python Web 培训班,但是学的不好,后来直接放弃了,决定还是回过头来好好把前端搞扎实吧,重新学了一遍 JS,然后看了看 JQuery,研究了里面选择器实现的源码,然后去学 Vue,当然也跟着网上的教程做了一些项目,比如慕课网上黄轶老师的饿了么项目和炸鸡音乐Web App,还有 Dell Lee 的 Vue去哪儿网实战,一步步做完感觉对自己实战能力的提升还是很大的,起码能自己独立倒腾一个项目出来了。

大二下学期我开始接下了人生当中第一个外包项目,也参加了计算机设计大赛,赚来了三千多的第一桶金,也拿到了中南赛区二等奖的证书。这一切在外人看来其实是相当不错的经历了,但对我而言,我一直能够感受到一种强烈的危机,由于项目一直在赶时间,很多时候秉着能出来效果就行的心态来做,很多细节并没有我想象中做的那么完美,而且框架里面偶尔会出一些问题,但是我并没有时间去理解其中的原理。我觉得这并不是我要追求的东西。这种心态,说的好听点叫追求极致,难听点,就是强迫症。

在这种心态的驱使下,完成了外包和比赛后,我马上了投入了更深一步的学习。《JavaScript高级程序设计》好好再翻一遍,ES6 重新好好学一遍,看了一遍珠峰周啸天的 JavaScript 视频,在 CSDN 上做了相关的笔记(我觉得不算博客),以及在慕课网上学习了webpack的课程,React的入门视频,一路狂奔,学了很多。

也正是大二下学期期末的时候,我开始了在掘金发表第一篇文章,标志着写博客的经历正式开始。让我惊喜的是,发表出来的第一篇博客就被掘金社区的公众号转载了,我喜出望外,感觉特别惊喜,于是准备继续写下去,不断规划和输出新的内容。

很快,大二下结束后,暑假就到来了。在这个时间有些小伙伴已经出去找实习了,但我深知自己离 offer 还有一些差距,于是又感受到了一丝危机。我曾经问过自己: 如果我要去找实习,会遇到哪些问题?

  • 首先,项目自己觉得深度不够,拿不出手。
  • 其次,计算机基础并不扎实,数据结构和算法掌握的并不好,计算机网络也没基础。
  • 最后,前端技术的一些原理知之甚少,更别说框架源码了。

因此,在大三前的暑假开始,我开始给我的未来实习布道。首当其冲的就是自己去做一个让自己满意的项目,这个项目必须足够的精致,同时不是为了应付任何人。这个项目采用 React 来做的,当时是统一用的 class 组件,后来想试用一下 hooks 特性,发现真香,直接用 hooks 重构了。这个项目也就是我那本掘金小册项目的前身。当我把代码放到 Github 上的时候,没几天的时间就收获了上百了个 star,让我感到特别意外,而不久之后就有同学在 issue 区留言,觉得是一个不错的练习项目,能不能弄个教程出来。接下来我尝试着这个项目更大的价值,事实上我也做到了,写成了小册放到社区,反响还不错。关于项目具体细节,详情请点这里查看。

关于计算机基础,我在大三上学期花了不少的精力学习数据结构和算法,首先学完了慕课网 bobo 老师的数据结构从入门到进阶、算法与数据结构综合提升以及玩转算法面试这三门课程,夯实了所有的基础之后,开始铺天盖地地刷 leetcode,一学期刷了 100 多道算法题。对于计算机网络,当时确实没有时间学了,就把这部分的计划放在了寒假。

最后是前端技术的深入学习,分为 3 个方向精进,JS 基础、浏览器和框架。

一方面是JS的学习,对我而言,JS 明明学了很多遍了,但是实际上忘的也很快的,我打算重读一遍红宝书,然后重新建立完整的 JS 知识体系。紧接着我开始了《JS灵魂之问》系列博客的创作,尝试着去系统地整理 JS 的知识点,又必须要达到一定的深度,当时对我来说其实是一个相当大的挑战。在这个整理的过程当中,我也逼着自己去参考了大量的资料和博客,说实话学到了不少,更让我意外的是,这个系列让我从此在掘金大火,帮助了许许多多在 JS 进阶路上的前端。

在浏览器这块,其实很多运行原理之前也是一知半解,直到一个偶然的机会,发现了极客时间上一个口碑不错的专栏,专门讲浏览器的,耐下心来读完之后,感觉收获还是挺大的,推荐大家去好好看看,解开了之前很多关于浏览器原理的疑惑。

然后是前端框架,我后面逼自己去读完了 Vue 源码,原因很简单,为了面试,但没想到的是,我目前遇到的面试对我源码方面问的并不深,只是非常常规的一些原理性的问题,但无疑的是,通读源码这个指标对面试的评估来讲是相当加分的,并且能够让自己站在一个更高的高度去应对面试,遇到相关的面试问题会非常从容。更重要的是,阅读完源码,对我个人对于 JS 的理解和 SDK 设计以及设计模式的理解更加深入了一步,这是我当时没有想到的,也是很长一段时间让我受益的财富。可能有人会问你是怎么就做到的,关于源码的阅读方法,话题有点大,后面再介绍吧。

大三上就准备了这么一些东西,顺带着整理了自己的博客,期末的时候已经上架小册、粉丝过万了。

紧接着到了寒假,我把数据结构和算法重新复习了一遍,TCP 和 HTTP 好好系统学了一遍,同时看了一些 chromium 的源码,复习了一波 Vue 源码,感觉火候差不多了就开始投递简历了,于是投了阿里和字节跳动,便有上面的面经了。

亲身经验分享

目前的经历分享就这些,可能会有些记流水账的感觉,但正是这样我觉得才足够真实,因为对前端而言,不可能照着一个系统的学习路径按部就班,然后达到一个很高的水平,这种美化过的经历说出来连我自己都不信,谁的人生不是这么误打误撞过来的呢?那你可能就会问了,你凭什么能够把基础学的那么扎实,通过这些大厂的面试呢?

我觉得有两点,一点是外在的因素,一点是内在的因素。

对外在的方面,我在输入一些信息的同时,会加入自己的思考和推敲,然后用自己的方式来输出,整理成博客,这使得我能够对知识体系本身有更加深刻的理解,同时也能在忘记这部分知识点之后,重新回顾的时候能够很快捡起来,节省了非常多复习的时间。

对内在的方面,我觉得自驱力是一个比较重要的因素,即自己驱动自己学习的能力。其实说起来容易,做起来是非常难的,因为外界的诱惑实在是太多,而且学习本身就是脱离舒适区的活动,是一种反人性的活动,本身就是让人不舒服的,因此很多人不愿意主动学习,这是完全可以理解的。那我为什么会有这种强烈的自驱力呢?

因为危机感,危机感随之带来了恐惧。

为什么这么说?

以前听《得到》APP上的梁宁老师讲过,人性其实只有两大痛点: 一个是愉悦,一个是恐惧。 愉悦感可以让人沉浸在一件事情当中干一万小时,成为高手,而恐惧带来的动力更加显著。对产品来说,要么就让用户爆爽,要么就去帮助他抵御恐惧,否则就不是一个优秀的产品。那么对于个人的成长而言,你做一件事情,没有找到任何愉悦的感觉,也没有产生过任何恐惧,那么他基本上在这个领域一事无成。

换句话说,如果一件事情让你非常疯狂地去做,要么这件事让你爆爽,要么它帮助你抵御恐惧。

对我来讲,真正驱动我的是后者。危机意识让我挖掘出真正的痛点,发现自己的恐惧所在,从而带来强大的自驱力。如果说仅仅是学一些东西来炫耀一番,或者只是去迎合外界的期望,这种动力可以有,但仅仅只是暂时的。当你走出舒适区,面对外界无数诱惑的时候,真正能 carry 你继续学习的是你内心的痛点

我觉得明白这一点,比所谓的学习路径、学习方法重要得多。因为大多数时候我们不是缺少学习资料,或者没有掌握什么高效的学习方法,只是因为你动力不足容易懈怠罢了。每个人情况都各不相同,但我觉得想要成长,挖掘自己真正的痛点是最重要的一件事情。

字节跳动三轮技术+一轮HR

技术一面(60min)

  • 刚开始就问我的项目,问的很详细。
  • webpack 提高构建速度的方式
  • loader 输入什么产出什么 ?
  • webpack 原理
  • webpack 动态加载的原理
  • webpack 热更新
  • 如何写一个 webpack plugin
  • AST 的应用
  • 如何解析一个 html 文本,还是考 AST
  • babel 原理,怎么写 babel 插件
  • 如何设计一个沙盒 sandbox ?
  • 小程序的 API 做了什么处理,能够做到全局变量的隐藏,如果是你,怎么设计 ?
  • 基础题考闭包的,我讲对了思路,结果没做对。
  • 实现颜色转换 'rgb(255, 255, 255)' -> '#FFFFFF' 的多种思路。
  • 提供一个数字 n,生成一组 0~n-1 的整数,打乱顺序组成数组,打乱几次,如何能够看起来平衡,说出你能想到的所有方法。
  • leetcode 239
  • 随便问环节,我问了考闭包的那道题,我答得很好。

二面技术 leader(60min)

  • 业务,业务,还是业务,项目复盘有没有更好的解决方案。
  • 如何处理一个重大事故 bug
  • 监控体系
  • 虚拟 dom 有什么好的地方? 框架为什么要设计虚拟 dom?
  • webpack 的缺点,让你设计一个新的构建打包工具,你会怎么设计?
  • 在线文档编辑,如何处理两人的冲突,如何展示,考虑各种场景
  • excel 文档冲突高级处理,文章冲突呢?是上个问题的深化。
  • 基础题,直接写出答案:
let x = [1, 2, 3]; 
let y = x; 
let z = [4, 5, 6]; 
y[0] = 10; 
y = z; 
z[1] = 20; 
x[2] = z = 30; 
console.log(x, y, z);
复制代码
  • 基础题:简单实现一个 LRU
  • 随便问环节

三面业务 leader(60min)

  • 算法题:从数组 [1, 5, 8, 10, 12] 中找到两个数和为 9,返回 [1, 8] 这样的结果。
  • 算法题:从数组 [1, 5, 8, 10, 12] 中找到三个数和为 19,返回 [1, 8, 10] 这样的结果。
  • 算法题 leetcode 300:给定一个无序的整数数组,找到其中最长上升子序列的长度。
  • 针对我的项目提问,大概 40 分钟吧。

HR 面:(30min)

  • 做项目的初衷在什么地方?

  • 歌曲倍速播放的功能是怎么实现的?为什么要想到这个?

  • 公司的业务可能会压榨自己开源分享的时间,你会介意吗?

  • 公司内的一些代码不能开源,和你自己的开源分享冲突了,你怎么办?

  • 你为什么不早点去实习?现在才开始找实习?

  • 看了你的 GPA ,还是蛮靠前的,你怎么平衡学校的学业和技术的学习的?

  • 怎么看待别人在你博客下面发一些怼你的评论?

  • 在学校有社团经历吗?

  • 自己平时有什么兴趣爱好?

  • 和室友关系咋样?

是的,我的字节跳动面试顺利,这一面算法没有难倒我,基本上看到题目我就能想出解法。虽然我简历上的项目偏简单了点,但好在我有好好总结和复盘(最终有惊无险拿到了offer!)………

学习经历及经验

面试经验分享

准备阶段

在面试之前,可能很多人会跟我一样感到焦虑,觉得自己还没准备好,想多复习一些东西,可越复习越感觉自己不会的东西更多,从而迟迟不敢出去面试。这其实是个悖论,原因就在于技术本身就是学不完的,此时我们需要好好调整一下自己的心态,做两手准备:

  • 划清知识体系和边界
  • 给自己安排一个截止日期(deadline)

准备时间是有限的,我们需要做的就是利用有限的时间达到最大效益的产出,因此尽量地做一些复习巩固和查漏补缺,发挥自己的优势,而不要去为了面试学新技术,或者深挖自己从未涉猎的领域。我根据自己目前的实际水平,制定了这样一份面试知识体系:

其实当时有些知识并没有完全掌握,但是又需要出去面试,所以给了自己一个截止日期,在 3 月 10 号之前,尽全力准备,到了 deadline,无论如何都要投简历出去。这样,后面的一系列面试就顺理成章了,没有拖得太久,同时准备的还不错。

另外,关于前端面试基础知识以及计算机基础,我已经在博客里面面试题做了系统的梳理和给出了参考解析,下面给大家一些已经产出的内容,让大家可以完整地学习:

第一章 HTML(★★)

1.浏览器页面有哪三层构成,分别是什么,作用是什么?

2.HTML5的优点与缺点?

3.Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

4.HTML5有哪些新特性、移除了哪些元素?

5.你做的网页在哪些浏览器测试过,这些浏览器的内核分别是什么?

6.每个HTML文件里开头都有个很重要的东西,Doctype,知道这是干什么的吗?

7.说说你对HTML5认识?(是什么,为什么)

8.对WEB标准以及W3C的理解与认识?.

9.HTML5行内元素有哪些,块级元素有哪些, 空元素有哪些?.

10.什么是WebGL,它有什么优点?.

11.请你描述一下 cookies,sessionStorage 和 localStorage 的区别?.

12.说说你对HTML语义化的理解?.

13.link和@import的区别?.

14.说说你对SVG理解?.

15.HTML全局属性(global attribute)有哪些?.

16.说说超链接target属性的取值和作用?

17.data-属性的作用是什么?

18.介绍一下你对浏览器内核的理解?

19.常见的浏览器内核有哪些?

20.iframe有那些缺点?

21.Label的作用是什么,是怎么用的?

22.如何实现浏览器内多个标签页之间的通信?.

23.如何在页面上实现一个圆形的可点击区域?

24.title与h3的区别、b与strong的区别、i与em的区别?

25.实现不使用 border 画出1px高的线,在不同浏览器的标准模式与怪异模式下都能保持一致的效果?

26.HTML5标签的作用?(用途)

27.简述一下src与href的区别?

28.谈谈你对canvas的理解?

29.WebSocket与消息推送?

30.mg的title和alt有什么区别?

31.表单的基本组成部分有哪些,表单的主要用途是什么?

32.表单提交中Get和Post方式的区别?

33.HTML5 有哪些新增的表单元素?

34.HTML5 废弃了哪些 HTML4 标签?

35.HTML5 标准提供了哪些新的 API?

36.HTML5 存储类型有什么区别?

37.HTML5 应用程序缓存和浏览器缓存有什么区别?

38.HTML5 Canvas 元素有什么用?

39.除了 audio 和 video,HTML5 还有哪些媒体标签?

40.HTML5 中如何嵌入视频?

41.HTML5 中如何嵌入音频?

42.新的 HTML5 文档类型和字符集是?

第二章 CSS (★★★)

  1. 解释一下CSS的盒子模型?

  2. 请你说说CSS选择器的类型有哪些,并举几个例子说明其用法?

3请你说说CSS有什么特殊性?(优先级、计算特殊值)

4要动态改变层中内容可以使用的方法?

  1. 常见浏览器兼容性问题与解决方案?

  2. 列出display的值并说明他们的作用?

  3. 如何居中div, 如何居中一个浮动元素?

  4. CSS中 link 和@import 的区别是?

  5. 请列举几种清除浮动的方法(至少两种)?

  6. block,inline和inlinke-block细节对比?

  7. 什么叫优雅降级和渐进增强?

  8. 说说浮动元素会引起的问题和你的解决办法.

13.你有哪些性能优化的方法?

14.为什么要初始化CSS样式?

15.解释下浮动和它的工作原理?清除浮动的技巧?

16.CSS样式表根据所在网页的位置,可分为哪几种样式表?

17.谈谈你对CSS中刻度的认识?

18.请你说说em与rem的区别?

19.请你说说box-sizing属性的的用法?

20.浏览器标准模式和怪异模式之间的区别是什么?

21.怪异Quirks模式是什么,它和标准Standards模式有什么区别?

22.说说你对边距折叠的理解?

23.内联与块级标签有何区别?

24.说说隐藏元素的方式有哪些?

25.为什么重置浏览器默认样式,如何重置默浏览器认样式?

26.谈谈你对BFC与IFC的理解?(是什么,如何产生,作用)

27.说说你对页面中使用定位(position)的理解?

28.如何解决多个元素重叠问题?

29.页面布局的方式有哪些?

30.overflow :hidden是否形成新的块级格式化上下文?

第三章 前端基础 (★★★)

1.说一下http和https. 55

2.tcp三次握手,一句话概括

3.TCP和UDP的区别

4.WebSocket的实现和应用

5.HTTP请求的方式,HEAD方式

6.一个图片url访问后直接下载怎样实现?

7.说一下web Quality(无障碍)

8.几个很实用的BOM属性对象方法?

9.说一下HTML5 drag api

10.说一下http2.0

11.补充400和401、403状态码

12.fetch发送2次请求的原因

13.Cookie、sessionStorage、localStorage的区别

14说一下web worker

15.对HTML语义化标签的理解

16.iframe是什么?有什么缺点?

17.Doctype作用?严格模式与混杂模式如何区分?它们有何意义?

18.Cookie如何防范XSS攻击

19.Cookie和session的区别

20.一句话概括RESTFUL

21.讲讲viewport和移动端布局

22.click在ios上有300ms延迟,原因及如何解决?

23.addEventListener参数

24.cookie sessionStorage localStorage区别

25.cookie session区别

26.介绍知道的http返回的状态码

27.http常用请求头

28.强,协商缓存

29.HTTP状态码说说你知道的

30.讲讲304

31.前端优化

32.GET和POST的区别

33.301和302的区别

34.HTTP支持的方法

35.如何画一个三角形

36.状态码304和 200

37.说一下浏览器缓存

38.HTML5新增的元素

39.在地址栏里输入一个URL,到这个页面呈现出来,中间会发生什么?

40.cookie和session的区别,localstorage和sessionstorage的区别

41.常见的HTTP的头部

42.HTTP2.0 的特性

43.cache-control的值有哪些

44.浏览器在生成页面的时候,会生成那两颗树?

45.csrf和xss的网络攻击及防范

46.怎么看网站的性能如何

47.介绍HTTP协议(特征)

48.输入URL到页面加载显示完成发生了什么?

49.说一下对Cookie和Session的认知,Cookie有哪些限制?

50.描述一下XSS和CRSF攻击?防御方法?

51.知道304吗,什么时候用304?

52.具体有哪些请求头是跟缓存相关的

53.cookie和session的区别

54.cookie有哪些字段可以设置

55.cookie有哪些编码方式?

56.既然你看过图解http,那你回答下200和304的区别

57.除了cookie,还有什么存储方式。说说cookie和localStorage的区别

58.浏览器输入网址到页面渲染全过程

59.HTML5和CSS3用的多吗?你了解它们的新属性吗?有在项目中用过吗?

60.HTTP状态码

61.http常见的请求方法

62.get和post的区别

63.说说302,301,304的状态码

64.web性能优化

65.浏览器缓存机制

66.post和get区别

67.说一下css盒模型

68.画一条0.5px的线

69.link标签和import标签的区别

70.transition和animation的区别

71.Flex布局

72.BFC(块级格式化上下文,用于清楚浮动,防止margin重叠等)

73.垂直居中的方法

74.关于js动画和css3动画的差异性

75.说一下块元素和行元素

76.多行元素的文本省略号

77.visibility=hidden, opacity=0,display:none

78.双边距重叠问题(外边距折叠)

79.position属性 比较

80.浮动清除

81.css3新特性

82.CSS选择器有哪些,优先级呢

83.清除浮动的方法,能讲讲吗

84.怎么样让一个元素消失,讲讲

85.介绍一下盒模型

86.position相关属性

87.css动画如何实现

88.如何实现图片在某个容器中居中的?

89.如何实现元素的垂直居中

90.CSS3中对溢出的处理

91.float的元素,display是什么

92.隐藏页面中某个元素的方法

93.三栏布局的实现方式,尽可能多写,浮动布局时,三个div的生成顺序有没有影响

94.什么是BFC

95.calc属性

96.有一个width300,height300,怎么实现在屏幕上垂直水平居中

97.display:table和本身的table有什么区别

98.position属性的值有哪些及其区别

99.z-index的定位方法

100.CSS盒模型

101.如果想要改变一个DOM元素的字体颜色,不在它本身上进行操作?

102.对CSS的新属性有了解过的吗?

103.用的最多的css属性是啥?

104.line-height和height的区别

105.设置一个元素的背景颜色,背景颜色会填充哪些区域?

106.知道属性选择器和伪类选择器的优先级吗

107.inline-block、inline和block的区别;为什么img是inline还可以设置宽高

108.用css实现一个硬币旋转的效果

109.了解重绘和重排吗,知道怎么去减少重绘和重排吗,让文档脱离文档流有哪些方法

110.CSS画正方体,三角形

111.overflow的原理

112.清除浮动的方法

113.box-sizing的语法和基本用处

114.使元素消失的方法有哪些?

115.两个嵌套的div,position都是absolute,子div设置top属性,那么这个top是相对于父元素的哪个位置定位的。

116.说说盒子模型

117.display

118.怎么隐藏一个元素

119.display:none和visibilty:hidden的区别

120.相对布局和绝对布局,position:relative和obsolute。

121.flex布局

122..block、inline、inline-block的区别。

123.css的常用选择器

124.css布局

125.css定位

126.relative定位规则

127.垂直居中

128.css预处理器有什么

129.get请求传参长度的误区

130.补充get和post请求在缓存方面的区别

131.说一下闭包

132.说一下类的创建和继承

133.如何解决异步回调地狱

134.说说前端中的事件流

135.如何让事件先冒泡后捕获

136.说一下事件委托

137.说一下图片的懒加载和预加载

138.mouseover和mouseenter的区别

139.js的new操作符做了哪些事情

140.改变函数内部this指针的指向函数(bind,apply,call的区别)

141.js的各种位置,比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别?

142.js拖拽功能的实现

143.异步加载js的方法

144.Ajax解决浏览器缓存问题

145.js的节流和防抖

146.JS中的垃圾回收机制

147.eval是做什么的

148.如何理解前端模块化

149.说一下Commonjs、AMD和CMD

150.对象深度克隆的简单实现

151.实现一个once函数,传入函数参数只执行一次

152.将原生的ajax封装成promise

153.js监听对象属性的改变

154.如何实现一个私有变量,用getName方法可以访问,不能直接访问

155.==和===、以及Object.is的区别

156.setTimeout、setInterval和requestAnimationFrame之间的区别

157.实现一个两列等高布局,讲讲思路

158.自己实现一个bind函数

159.用setTimeout来实现setInterval

160.用setTimeout来实现setInterval

161.代码的执行顺序

162.如何实现sleep的效果(es5或者es6)

163.简单的实现一个promise

164.Function.proto(getPrototypeOf)是什么?

165.实现js中所有对象的深度克隆(包装对象,Date对象,正则对象)

166.简单实现Node的Events模块

167箭头函数中this指向举例

168.js判断类型

169.数组常用方法

170.数组去重

171.闭包 有什么用
...

❤️篇幅有限,更详细的内容点击我获取完整版pdf查看❤️

第四章 前端核心(★★★★★)

1.JavaScript 有几种类型

2.深浅拷贝

3.作用域

4.原型和继承

5.new和this

6.apply、call、bind

7.数据处理

8.Event Loop

9.浏览器页面渲染过程

10.JSONP的缺点

11.跨域(jsonp,ajax)

12.如何实现跨域

13.dom是什么,你的理解?

14.关于dom的api有什么

15.ajax返回的状态

16.实现一个Ajax

17.如何实现ajax请求,假如我有多个请求,我需要让这些ajax请求按照某种顺序一次执行,有什么办法呢?如何处理ajax跨域

18.写出原生Ajax

19.如何实现一个ajax请求?如果我想发出两个有顺序的ajax需要怎么做?

20.Fetch和Ajax比有什么优缺点?

21.移动应用和web应用的关系

22.知道PWA吗

23.做过移动端吗

24.知道touch事件吗

25.移动端的DEMO什么的有没有做过点的

第五章 前端进阶(★★★)

  1. 前端测试

  2. 作为一个项目负责人怎么协调多人协作

  3. 接口文档的制定

  4. 需求不明确,接口文档是不是越详细越好

5.webpack和gulp区别(模块化与流的区别)

6.redux用处

7.redux里常用方法

8.angularJs和react区别

9.vue双向绑定原理

10.说说vue react angularjs jquery的区别

11.node的事件方法讲讲看

12.node的特性,适合处理什么场景

13.你有用到Express,讲讲Express

14.promise的状态有那些

15.数组移除第一个元素的方法有哪些?

❤️篇幅有限,更详细的内容点击我获取完整版pdf查看❤️

第六章 移动端开发(★★★)

1.介绍一下react

2.React单项数据流

3.react生命周期函数和react组件的生命周期

4.react和Vue的原理,区别,亮点,作用,

5.reactJs的组件交流

6.有了解过react的虚拟DOM吗,虚拟DOM是怎么对比的呢

7.项目里用到了react,为什么要选择react,react有哪些好处

8.怎么获取真正的dom

  1. 选择react的原因

10.react的生命周期函数

11.setState之后的流程

12.react高阶组件知道吗?

  1. React的jsx,函数式编程

14.React的生命周期

15.说说自己理解的react

16.react的组件是通过什么去判断是否刷新的

17.其他移动APP开发框架(PhoneGap,AppCan,HTML5+,Framework7)

第七章 计算机基础(★★★)

1.TCP建立连接的三次握手过程

2.cdn原理

3.说一下用户从输入url到显示页面这个过程发生了什么

4.HTTP的头部包含哪些内容。常见的请求方法(我为什么要说后面的options,head,connect)

5.请求方法head特性

6.HTTP状态码,301和302有什么具体区别,200和304 的区别

7.OSI七层模型

8.TCP和UDP的区别,为什么三次握手四次挥手

9.HTTP缓存机制

10.websocket和ajax的区别是什么,websocket的应用场景有哪些

11.TCP/IP的网络模型

12.知道什么跨域方式吗,jsonp具体流程是什么,如何实现原生Jsonp封装,优化,对于CORS,服务器怎么判断它该不该跨域呢

13.怎么生成token,怎么传递,

14.操作系统进程和线程的区别

15.什么是进程 线程

16.线程的那些资源共享,那些资源不共享

  1. linux指令用的多吗,怎么进行进程间通信

  2. kill指令了解过吗

19.操作系统里面进程和线程的区别

20.Linux查询进程指令,查询端口,杀进程,

21.进程间的通信方式有哪些?

22.Redis和 mysql

第八章 算法与数据结构(★★★★)

1.二叉树层序遍历

2.B树的特性,B树和B+树的区别

3.尾递归

4.如何写一个大数阶乘?递归的方法会出现什么问题?

5.把多维数组变成一维数组的方法

6.知道的排序算法 说一下冒泡快排的原理

  1. 说一下你了解的数据结构 区别

8.Heap排序方法的原理?复杂度?

9.几种常见的排序算法,手写

10.数组的去重,尽可能写出多个方法

11.如果有一个大的数组,都是整型,怎么找出最大的前10个数

12.知道数据结构里面的常见的数据结构

13.找出数组中第k大的数组出现多少次,比如数组【1,2,4,4,3,5】第二大的数字是4,出现两次,所以返回2

14.合并两个有序数组

15.给一个数,去一个已经排好序的数组中寻找这个数的位置(通过快速查找,二分查找)

第九章 设计模式(★★★★)

1.设计模式:单例,工厂,发布订阅

2.看过一些设计模式的书?你觉得设计模式怎么样?

❤️篇幅有限,更详细的内容点击我获取完整版pdf查看❤️

接下来进入面试的阶段。

关于算法:

算法的准备那是一定一定要刷题的,大概分为这样的步骤:
第一阶段:对于某一个具体的算法,首先要搞清楚这个算法解决的问题是什么,可能是实现一个具体的功能,也可能是在某些方面,比如时间复杂度或者空间复杂度方面很卓越,总之搞清楚这个算法被研究出来的目的是什么。

第二阶段:然后就要弄清楚这个算法的生存环境了,也就是看看你此时研究的东西是不是对别的知识有依赖,应该先把底层依赖的知识理解并掌握。这些问题都解决之后,就进入到算法本身的学习,理解一个算法是一件辛苦的事情,刚开始看必然会产生很多的困惑,比如经常会怀疑作者讲述的内容的重要性?这些内容和这个算法有什么联系呢?经常会有这种摸不着头脑的感觉,其实作者做的铺垫都是为了建立起描述算法主要内容的基础,只有接受和理解这些基础,才能逐渐触碰到算法的精髓,所以耐心是很重要的。

第三阶段:算法的主要过程看完之后,往往还是会感到困惑,主要是不知道这个过程好在哪,这就进入了下一个阶段,理解作者对这个过程在功能性或者效率卓越这件事上的解释和证明。这才真正触碰到算法最精髓的部分,也就是深度的理解算法的主要过程所带来的好处,这才是最锻炼人理解能力的地方。

第四阶段:上面几点是算法学习阶段的过程了,接下来就是研究算法的代码实现,自己设计测试用例亲自跑一下代码,以及从代码运行时间的角度分析这个算法的优势,这也是加深对算法的理解的过程。

第五阶段:最后是配合相应的题目练习,让自己通过题目练习的方式,会用、善用学习到的算法,并对这个算法产生一定的敏感程度,具体是指看到某些题目时,能够根据题目的特点,产生与该算法的对应,也就是具备举一反三的能力。

面试阶段

从上面的面经中可以看到不同方向、不同级别的面试官各自的偏好不一样,因此对于不同的面试官,采取的策略也应有所不同。但我更想分享的是一些具有共性的地方,这些策略可以适用于绝大部分的面试场景,让自己获得更大的竞争优势。当然,所谓的面试策略,都是基于你前期充分的准备,不然都只是天方夜谭,毫无可行性。

策略一: 备好杀手锏

面试官一天可能要面5-6人,甚至十几人,那么你是否想过: 他凭什么对你印象更加深刻?

心理学有一个效应叫峰终效应,就是人在一个有限的活动当中,对一件陌生事物的看法大致由两个时间点所决定: 一个是高潮点,一个是结尾的点。

对面试而言,我认为同样是适用,具体来讲,和面试官的交流,其实也就是和一个陌生人的交流,如何来给他留下更深刻的印象?需要在高潮点展现自己,在结尾点保护自己,在面试的过程中适当给面试官一些和别人不一样的回答和见解,使之感到惊艳,而在结尾的时候,你说的话其实更容易被面试官记住,这个时候由于面试已经接近尾声,你可能没有当时那么紧张,这个时候需要适当的谨慎一些,不要彻底放松,避免不小心说出一些对自己处境不利的话。

其实,我更想强调的是前者,即如何将面试带上一个高潮点,并且让面试官感到惊艳。其实这并不是什么简单的事情,毕竟能惊艳的只是少数,那么如果才能做到这一点呢?

在面试前,不妨准备好自己的杀手锏。什么是杀手锏?就是每当面试官问到相关的问题的时候,你能够有自信比 90% 的人理解得更深刻,回答更出色。以我自己为例,我准备的杀手锏并不少,HTTPS 所有加密算法chromium 进程 IPC 原理斐波拉契第 n 数的 logn 解法浏览器渲染过程vue 编译器架构vue 双向绑定快排以及手写 V8 排序......

在其它基础知识都 OK 的前提下,这些杀手锏是你技术上的核心竞争力,这是你和其他人相比体现不可替代性的地方。当然,时间有限,不可能每个角度都能研究很深入,但如果你不准备,跟大家背一样的答案,很难从人群当中脱颖而出。

策略二: 适当暗示

面试的过程其实就是一个和面试官互相试探的过程,一方面是他对你提问,另一方面你需要给他一些信号,引导他去挖掘你的闪光点。

其实有两个时机可以发一些暗示的信号,一个是自我介绍的环节,这个环节中可以向面试官展示出你之前深入研究过哪一块的技术,指引他往那个方向问,另一个是技术细节的提问,可以在回答的时候适当发挥,大部分面试官是愿意听你展开的。

最后

暂时先分享这么多吧,希望大家都能在春招当中拿到自己满意的 offer。

你可能感兴趣的:(非科班出身字节跳动前端offer,我有一份50000字面试宝典分享给你!)