周刊3三年大厂面试官十道前端面试题欢迎挑战

3次阅读

共计 2559 个字符,预计需要花费 7 分钟才能阅读完成。

前言

在两家大厂工作了 6 年,当了 3 年的前端面试官,把一些较难的面试题与答案汇总在我的 Github 中。希望对大家有所帮助,助力大家进入自己理想的企业。

项目地址是:https://github.com/airuikun/W…

希望大家不要看到题目就直接看答案,还是希望先自己进行思考,在思考的过程中,会有意想不到的收获。

面试题挑战

我把下面每道题的难度高低,和对标的职级,都写上去了,大家可以参考一下,但不是唯一评判标准。

第 1 题:请设计一个攻击服务器的策略

难度:阿里 p5 ~ p7、腾讯 t21 ~ t31

我提供几个常见的策略吧

  • 前段时间很火的一个例子,伪造虚假 npm 包 + nodejs 版本的 payload
  • nodejs 的反序列化攻击

其实你多关注知乎或者一些前端热点,都会发现有很多很多的这种攻击和漏洞的 case 讲解,但是有没有一些很难并且大家都没想到过的策略和思路呢?

欢迎展现自己的实力和创意

如果你有好的想法或答案,欢迎在这题目对应的 github 下留言:https://github.com/airuikun/W…

第 2 题:请写一个正则,去除掉 html 标签字符串里的所有属性,并保留 src 和 href 两种属性

难度:阿里 p6+ ~ p7、腾讯 t23 ~ t31

这题目简单的理解就是,写一个正则表达式,将字符串 ’ 正则 ’ 转化成 ’ 正则 ’。

当然,真正包含一个网页的 html 的字符串要比这个复杂。

而且,google 里关于这个问题的前三篇文章答案,都存在严重的问题,随便写几个 case 都是满足不了的。

正则的问题,很多前端人员都停留在如何用正则去判断一个数字是不是手机号,一段字符串是不是邮箱,说实话,这都没用到正则知识体系的十分之一

在一些工程项目难题上,如果正则使用到位,真的是一行正则可以抵 1000 行代码。

建议有能力的小伙伴,可以玩一下这题。

如果你有好的答案或想法,欢迎在这题目对应的 github 下留言:https://github.com/airuikun/W…

第 3 题:react 项目中的 JSX 里,onChange={this.func.bind(this)} 的写法,为什么要比非 bind 的 func = () => {} 的写法效率高 请解释其中的原理

难度:阿里 p5 ~ p6、腾讯 t21 ~ t22

这题考察了函数在内存块占用执行和调度等,和对 bind 的深层理解。

欢迎挑战

如果你有好的想法或答案,欢迎在这题目对应的 github 下留言言:https://github.com/airuikun/W…

第 4 题:十万条数据插入数据库,怎么去优化和处理高并发情况下的 DB 插入

难度:阿里 p6+ ~ p7+、腾讯 t23 ~ t32

这种题,你懂的,逼格高,亮瞎眼,大厂太爱考了。

不过装逼归装逼,有能力并且真真正正处理过这些高并发情况的 FE,这题是他们一个很好的展现机会。

以前我的 mentor,用 nodejs 实现了高并发的智能容灾,我至今记忆犹新,并且他也收获了那年的高绩效。

来玩一下?

欢迎挑战,如果你有好的想法或答案,欢迎在这题目对应的 github 下留言:https://github.com/airuikun/W…

第 5 题:解释一下在 js 里,0.1+0.2 为什么等于 0.30000000000000004,如何通过代码解决这个问题?

难度:阿里 p5 ~ p6、腾讯 t21 ~ t22

第二问我给个简单的思路吧:将浮点数转换为整数来进行计算。

答案不唯一,欢迎提供更好的 idea

欢迎挑战,如果你有好的想法或答案,欢迎在这题目对应的 github 下留言言:https://github.com/airuikun/W…

第 6 题:设计一个策略和方法,实现在 https 的前端项目里进行 http 请求

难度:阿里 p6 ~ p6+、腾讯 p22 ~ t23

欢迎挑战,如果你有好的想法或答案,欢迎在这题目对应的 github 下留言言:https://github.com/airuikun/W…

第 7 题:一个 iframe,内嵌了一个 A 页面,iframe 的宽高不停变化,如何让 A 页面的宽高实时自适应这个 iframe 的宽高大小。请说出至少 3 种方法,越难越好

难度:阿里 p6 ~ p6+、腾讯 t22 ~ t23

这种题有简单方法,也有难的方法,我建议大伙在面试的时候,尽量往难的说。

欢迎挑战,如果你有好的想法或答案,欢迎在这题目对应的 github 下留言言:https://github.com/airuikun/W…

第 8 题:v8 有了解过吗?讲讲了解过 v8 的那几个模块和部分,比如解释一下 v8 的 hidden class

难度:阿里 p6+ ~ p7、腾讯 t23 ~ t31

不要抵触面试官考察 v8,还是那句话,你对一个问题回答的深度,是面试官评价你能力的参考和标准。

挑战一下吧

欢迎挑战,如果你有好的想法或答案,欢迎在这题目对应的 github 下留言言:https://github.com/airuikun/W…

第 9 题:现在有多个 spa 的项目,有 angular 的,有 vue 的和 react 的,如何将他们合并成一个大统一的 spa 项目

难度:阿里 p7 ~ p7+、腾讯 t31 ~ t32

很多公司,都有很多的老项目,并且都是不同框架,很分散,很多上级的上级,很喜欢提这种多项目统一的需求。

这时候你就会面临不同框架的项目重构。

如果你遇到这些问题,打算重写项目,那是非常费力不讨好的。这些问题,其实是能框架层面上去解决的。

我提供个思路,比如在 angular 项目里融合 react 项目,可以从 ReactDOM.render 结合 angular 的路由入手。

再提供个思路,例如简单的 vue 和 react 项目,可以用 ast 等手法,将代码互转。但这个我曾经实践过,会面临很多的 bad case。

剩下的一些思路,欢迎大家挑战。

欢迎在这题目对应的 github 下留言言:https://github.com/airuikun/W…

第 10 题:讲一下 png8 png16 png32 的区别,并简单讲讲 png 的压缩原理

难度:阿里 p5 ~ p6、腾讯 t21 ~ t22

针对 png 原理的问题,我写了一个文章,轻松搞笑通俗易懂,大家可以看一下,放松放松《PNG 图片压缩原理 – 屌丝的眼泪》

交流

我是小蝌蚪,担任高级前端工程师

欢迎关注我的微信公众号,微信扫下面二维码或搜索公众号“前端屌丝”,讲述了一个前端屌丝逆袭的心路历程,共勉。

正文完
 0