当前位置:   article > 正文

2020.10.29腾讯QQ音乐社招前端电话一面总结_qq音乐面试流程

qq音乐面试流程

2020.10.29腾讯QQ音乐社招前端电话一面总结

面试官晚上19:16打过来的,聊了44分钟,到八点准时结束。无论过没过,都记录一下面试过程吧,是问了几个大问题,在几个大问题的基础上根据你的回答,再去问一些小问题。


前言

【面试官】:先自我介绍下吧
【我】:我现在是在南京工作,工作一年多了,公司里用的是React框架,接下来我也打算以React为主技术栈。
【面试官】:嗯,没了吗
【我】:嗯…
【面试官】:你换工作的原因是什么
【我】:我是从大三开始就想进大厂了,一直也在准备着,毕业时投了一些简历但是没有机会。所以又边工作边准备了一年多,现在有人帮我内推我就赶紧试一试。
【面试官】:你是什么开始学习前端的
【我】:我大三的时候开始在国外的一个叫做FCC(FreeCodeCamp.org)的网站上学习的,在那上面学了HTML、CSS、JQuery、JS。我在毕业的时候还不会框架,在学校里的时候,做项目都是用PHP+JQuery做的。进入这家公司之后,公司用的是React框架,我就花了一段时间感觉学习了React框架,学完React后感觉自己提升了好多,又接着学了一些前端的其他东西,前端的知识简直越学越多,感觉都学不完
【面试官】:你是在一个网站上学习的,那你有没有看过一些书籍之类的
【我】:我不怎么看纸质的书,我一般都是看网上的文档,因为纸质的书代码都在书上面,一行一行照着写也很麻烦,而且不方便在我有疑问的时候得到反馈。我学习主要是以在网上买视频课为主,因为买视频课可以直接学习到这个技术怎么用,它的原理是什么,遇到不会的地方还可以去联系他问他,现在这些付费的课程都会有个交流群,群里的其他学员也都会跟你一起交流,我觉得这样学习效率高一点,比看书好一点。

(巴拉巴拉说了这么一大堆,面试官就直接进入正题开始问了)


有了解怎么给一个不存在的元素添加事件吗

【我】:不存在的元素啊?那要先创建这个元素吧
【面试官】:那在创建之前就没有办法绑定事件吗
【我】:创建之前啊,那在创建之前…我好像不知道…
【面试官】:有一个div,里面会有一些元素,在点击元素的时候会触发一个事件,但是它现在并不在div里面
【我】:那可以把事件挂在父组件上面吗,可以吧,由父组件触发,然后可以检测到里面的target是谁
【面试官】:那它利用的是什么原理
【我】:是事件的代理
【面试官】:事件的代理是什么原理
【我】:事件的冒泡
【面试官】:事件的三个阶段是怎样实现的
【我】:先是从父组件到子组件的捕获,然后触发事件,最后从子组件冒泡到父组件。
【面试官】:那用事件捕获可以实现事件代理吗
【我】:额…可以
【面试官】:那一般你是用什么方式实现的
【我】:我一般使用冒泡
【面试官】:那为什么不用捕获呢
【我】:因为…嗯…嗯…我没注意过这个

参考MDN:
对事件冒泡和捕捉的解释
当一个事件发生在具有父元素的元素上(例如,在我们的例子中是<video>元素)时,现代浏览器运行两个不同的阶段 - 捕获阶段和冒泡阶段。 在捕获阶段:

浏览器检查元素的最外层祖先<html>,是否在捕获阶段中注册了一个onclick事件处理程序,如果是,则运行它。

然后,它移动到<html>中单击元素的下一个祖先元素,并执行相同的操作,然后是单击元素再下一个祖先元素,依此类推,直到到达实际点击的元素。

在冒泡阶段,恰恰相反:

浏览器检查实际点击的元素是否在冒泡阶段中注册了一个onclick事件处理程序,如果是,则运行它

然后它移动到下一个直接的祖先元素,并做同样的事情,然后是下一个,等等,直到它到达<html>元素。

在现代浏览器中,默认情况下,所有事件处理程序都在冒泡阶段进行注册。
事件冒泡是令人讨厌的行为,但有一种方法来解决它。标准事件对象具有可用的名为 stopPropagation()的函数, 当在事件对象上调用该函数时,它只会让当前事件处理程序运行,但事件不会在冒泡链上进一步扩大,因此将不会有更多事件处理器被运行(不会向上冒泡)。

事件分三个阶段:捕获、目标、冒泡。
捕获:由外向内,由不具体到最具体,由document到元素
目标:就是事件触发的元素
冒泡:由内向外,由最具体到最不具体,由元素到document

事件委托
冒泡还允许我们利用事件委托——这个概念依赖于这样一个事实,如果你想要在大量子元素中单击任何一个都可以运行一段代码,您可以将事件监听器设置在其父节点上,并让子节点上发生的事件冒泡到父节点上,而不是每个子节点单独设置事件监听器。


有了解过DOMContentLoaded这个事件吗

【我】:知道,这个是在网页图片、CSS全部加载完之后触发
【面试官】:window.onload事件呢?
【我】:啊,那你刚才问的是哪个,不是load吗(原谅我耳背了…)
【面试官】:DOMContentLoaded,我刚才问的是DOMContentLoaded
【我】:哦抱歉那我刚才听错了,我刚才讲的就是load事件,DOMContentLoaded事件就网页的骨架加载完就触发,不会等待图片、CSS样式加载完
【面试官】:那如果外链的JS没有加载完,DOMContentLoaded事件会不会触发?
【我】:不会,哦不,外链…它会触发吧…我不太确定了
【面试官】:如果有个外链标签在网页的头部,那网页会展示内容吗
【我】:是指script标签吗,还是指link啊?
【面试官】:外链的JS
【我】:那就渲染不出来了,JS会阻塞渲染
【面试官】:那DOMContentLoaded触发以后,页面上会展示内容吗
【我】:会展示
【面试官】:那外连接没加载完,DOMContentLoaded会触发吗
【我】:哦那不会,JS会阻止这个渲染进程
【面试官】:那在中间呢
【我】:在中间的话,那也不会
【面试官】那在尾部呢
【我】:不会,要等JS走完
【面试官】:那要想让它不要阻塞的话,有什么办法
【我】:可以给script标签加一个defer属性,还有async,让它延迟加载
【面试官】:如果不用这两个的话,还有什么其他方案
【我】:嗯…还有type=“module”
【面试官】:对于浏览器不支持的情况,比如这三个都不支持的情况,怎么实现呢
【我】:那可以把script标签的加载写在DOMContentLoaded事件的回调中,执行的时候再去生成这个script标签
【面试官】:嗯,那你这样的话不就导致加载事件被延后了吗,为什么要在这个事件中写呢
【我】:因为这个时候页面应该渲染好了吧,没渲染好的话,会不会造成页面的时间很长呢(此时我崩溃的内心:抱歉这

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/450489
推荐阅读
相关标签
  

闽ICP备14008679号