CSS盒模型
content-box
border-box
箭头函数
this指向
不能作为构造函数使用
不能作为generater函数
内部没有arguments
跨域
cors解决跨域
proxy代理解决跨域
node接口代理、nginx反向代理
基于websocket协议
jsonp解决跨域
还有通过postMessage的,因为不是特别熟就没有说
预检请求(由cors解决跨域引出的问题)
对于复杂请求会进行预检,目的是通过options嗅探是否能成功通信,在第二次请求时才会携带请求参数
对于复杂请求预检能不能有多次(进一步引出的问题)
我说的是我见到的是每次都会有一个预检,没有见过多次。
但后来查了一下,其实面试官想问的是对于同一个复杂请求,下一次发送时会不会再进行预检。这个我知道如果不作处理是每次都会的,只是当时没有get面试官想要问的点。
面试官可能想问的是:重复的预检会消耗一定的性能,然后问优化方案。优化方案是通过全局过滤器对重复的预检请求进行过滤。
xss攻击
通过一些是输入框或者浏览器地址栏注入恶意脚本。分为存储型、反射型、DOM型,,然后把每一种类型说了一下。
举xss反射型攻击的例子(从上一个引出)
我只见过但是没有记住,实际项目中也没有对xss进行处理(即使是每次写代码都内心惶恐,感觉会出大问题,枯)。然后跟面试官说我可以举出来一个DOM型的,然后就说了通过javascript:形式注入。
浏览器缓存策略
说了强制缓存和协商缓存,以及对应的头部字段。
expires和cache-control的区别(进一步引申)
说了前者有时区问题,后者没有
通过etag进行协商缓存的流程(可能是我最开始说的不是很清晰,面试官想通过流程梳理一下)
说了第一次请求正常请求,响应时加etag字段表示使用协商缓存,下一次再发请求时请求加if-none-match字段(值为etag的值),服务器进行判别是否失效,未失效则返回304状态码表示可以从缓存中读取。
具体场景中采用什么样的缓存(进一步引申)
因为主要写前端,所以缓存策略一般在后端确定,所以就没去了解过。一开始有点懵,跟面试官说可能我知道,但是对于这个问题也许需要面试官给出xxx(当时词穷了),面试官get到了然后给了个具体场景。后来差不多算是答出来了一点,说的是需要根据数据的更新频率决定,css文件强制缓存,html说的是强制缓存在面试官引导下改成了协商缓存,对于一些不常发生更改的数据使用协商缓存(比如说个人信息)。
hooks使用有哪些限制
也是懵了一下,因为准备的比较多的是htmlcssjs基础和计网浏览器相关,没有太涉及框架。迷糊了一会儿之后想起来了ref影响性能,就说了useRef能少用则少用。
useRef为什么会影响性能(进一步引申)
说了由于它是直接操作了dom,所以性能低。不过后来重新看hooks的时候发现react对useRef作了进一步的处理,只是表面上看起来是直接操作dom,但实际上不是。
那有其他解决方案,不用ref吗(进一步引申)
说了更推荐通过手动模拟双向数据绑定,以受控组件的方式获取值和更改状态。
hooks能在分支语句中使用吗(算是一个对hooks限制的引导)
说了我在项目中试过,是不能的,使用时会报错,但是对于底层我暂时还不够了解。
useMemo(对hooks的进一步考察)
因为没用过,所以当时连问的是什么都不知道。但是跟面试官说了用过的不多,有useState、useRef、useEffect。
useEffect(基于上一问引申)
说了接受参数的情况,回调调用的时机,回调返回的回调的调用时机。
项目中是自己实现了富文本编辑吗
没有,只是借鉴了一小部分原理。(但是实际上其他原理我也是知道的,只是当时没有发挥好,没能借机发挥出来)
项目中的时间格式化
面试官想问的是怎么封装的第三方api,我说了是自己写的。
知不知道格式化时间的api(进一步引申)
其实是知道的(momentjs),当时实在是没想起来。然后说了课里面老师讲过,但是我想自己实现一下,并且项目中需要用到的格式其实也不多。
然后面试官问我是不是还是没想起来,我说是的。但是面试官很好奇老师原来还会讲这个么,然后就有点尬聊起来了。
接着问了我从什么时候开始学前端的,我说今年三月(对,没错,只学了几个月hiahiahia)。接着问了怎么学前端的,我说前期是看网课,因为学校没有开设前端的相关课程,后面觉得网课老师都是自己理解了原理然后用很浅显易懂的方法让我们理解,但是我们并不知道原理是什么,所以就去看书了,书里面会更全面和深入。
接着问了推荐哪些书,我说了首推红宝书,但是不适合新手入门,因为太厚重了,同时知识点也过于全面。接着说了《你不知道的js》,面试官忽然就兴趣来了,问我对这本书的看法。我意识到他想表达的是书里面那么高深的内容是不是实际上不怎么用,我就狠狠的反驳了,说一般开发也许不用(但其实一般开发也用),但是比较底层的深层次的开发就很有用,比如说我用框架的时候就会好奇这个框架是如何实现的,自己最近看angular的时候就发现里面有很多设计模式相关的东西。(然后面试官说我们扯远了,就又扯回来了,还蛮有意思的hiahiahia)
项目中搜索方法的实现
说了把字分开,统计出现的次数然后排序,然后面试官意识到这方法是我自己写的,就问了我知不知道目前有哪些搜索算法。我立马说这个我该自我反省一下,当时写这个方法的时候其实是想到了会有一些普适的搜索算法,也蛮好奇,但是并没有去主动了解。把搜索方法封装起来就是为了后续算法不合适的时候方便修改。
搜索如何优化(防抖节流)
面试官一直想通过搜索问防抖节流,但是我一直没提到,确实是我项目没有用就没想到。说了些我现场想到的思路,和自己的一些顾虑,就比如说每次输入框变化都会发请求我会担心这个性能问题。
面试官从我的话引申问了你了解过防抖节流吗。我说了解过,刚想解释概念和实现,面试官就接着问了为什么没有用,我说我觉得从知识到实践可能需要有前辈带吧(可能因为cue到了面试官,然后面试官当时笑了笑)或者是自己多看别人优秀的项目代码。
后面就到点要写算法了
(真要命,我是个算法小垃圾,我准备的手写题都没问到,并且陌生的题目还给的英文嘤嘤),面试官当时顺便问了我用没用过ts,我说用过一点,ts主要是对类型进行了一个限制。
算法不是排序也没有递归,是个查找,但又不是二分。但是实际上很简单,但是我muji怎么描述这道题目到底是个啥。面试官人还是很好的,中途给过一点点提示,虽然我最后完成度可能还是大概一半的样子。
反问环节
问了作为面试官会更看重求职者的哪些特质,面试官说他会分阶段看,对于大三这个阶段来说,他会更看重基础,团队用的react会对hooks有一定的要求,然后还有算法。接着问了面试官对我的表现的评判,记得不是很清楚了,跟上一问有点混在一起的样子,最后说的是我后面代码题有点卡顿。我肯定了这个,说我目前确实是入门阶段,还在持续的学习中。
面完我觉得自己整体表现还可以的,就是后面代码题不难但是没写出来很扣分,然后中途对于不熟的知识点说了蛮多句了解的还不够后面去学,所以还是觉得很悬,就各种紧张。后来开玩笑说,只要字节一分钟没有给我发邮件,我就一分钟没挂,我时刻准备着被挂,盆友们时刻准备着安慰我。然后,,没过多久就来了一封,,邮件,,,,慌的一匹,,,最后是字节的满意度调查问卷。后来觉得最快也得等到第二天才能拿到结果,结果就是下午两点的面试晚上九点就收到了hr约下一次面试的电话和邮件,当时都快激动傻了。
#面经分享#