70场面试,复盘我遇到的有趣问题(一)
一直面试只能让你把会的背的更熟,但想进步还是得回头看看不会的问题。
今天回顾一下我遇到的一些有价值的问题,结合我自己的一些理解对这些问题尝试解答一下,相信对大家一些知识的理解也会有些帮助(有问题的话欢迎指出)。
有用的话感谢大家点赞收藏送花~
1.(滴滴提前批二面)Vue开启了keep alive之后会经历哪些生命周期?缓存了什么东西?
这个点我自己是没有仔细思考过的,当时面试官提问vue的生命周期,我提到了Vue开启keep alive前后生命周期的不同,面试官拓展的问了这个问题。
背八股的时候都背过,使用 组件包裹后可以在切换路由的时候不必销毁组件。并且会多出两个生命周期:activated和deactivated。其中activated在组件渲染的时候执行,deactivated在组件隐藏时执行,因此将这两个生命周期对比mounted和beforeDestory来学习。组件在初次渲染的时候会经历从beforeCreate到mounted这整个阶段,在后续切换的过程中则只会经历activated,随后的beforeUpdate和updated都会经历,隐藏时经历deactivated,最后销毁的时候才会经历beforeDestory和destoryed。
那么缓存了什么?我们知道在mounted阶段,虚拟DOM转为真实DOM,此时data,method,虚拟DOM都有了;而activated阶段可以不经历前面的钩子,直接挂载DOM,说明keep-alive缓存了虚拟DOM,并且还有所有的数据/方法,也就是缓存了组件实例。
如果面试阶段没有见过这个题,可以从每个生命周期干了什么开始联想,其中走到mounted阶段拥有了什么,那么actived阶段就也会有这些。
2.(4399一面)http1.1的情况下,一个网页的图片是一张一张加载还是一批一批加载的?
首先回顾一下http1.1的特性:
● 默认长连接,新增响应头Connection:keep-alive字段,保持TCP连接不断开
● 管道化:基于上面长连接的基础,管道化可以不等第一个请求响应继续发送后面的请求,但响应的顺序还是按照请求的顺序返回
● 缓存处理:新增catch-control字段
● 断点传输机制。文件传输时如果遇到网络故障,可以从已经上传/下载好的地方继续请求,不用从头开始
其中第二点提到的管道化基本可以解答整个问题,虽然可以发送多个请求,但是返回的顺序还是有序的。因此虽然TCP最大连接数有6~8个,但是返回时还是顺序返回的。
但是需要注意,如果严谨一点的话还是要考虑一下预加载的情况。例如,当浏览器解析到 HTML 中的标签时,它可能会提前发起对指定资源(包括图片)的请求,这样在真正需要显示该图片时,可能已经加载完成或者部分加载,从而在一定程度上出现看似一批加载的情况。
3.(Minimax一面)eval和new Function的this指向问题:
eval的this指向可以看这篇,很详细:https://ayk.moe/articles/javascript-change-this-in-eval-function/index.html
简单的说:eval函数只要是在全局直接运行或者是通过一个函数调用执行、作为对象属性被调用执行这种间接的执行方式,他的指向都是全局作用域。他不能直接被call/bind/apply改变this指向,改变的思路是在eval外面包一层函数,改变外面这个函数的this指向。
new Function:使用 new Function 创建的函数,它的 [[Environment]] 指向全局词法环境,而不是函数所在的外部词法环境。因此,我们不能在 new Function 中直接使用外部变量。
如果你对这块不熟悉,来看看这个:https://zh.javascript.info/new-function
4.(Minimax二面)React:在if else里书写hooks,为什么不可以?
我用我自己比较容易理解的话术来简述一下关键原因,这里面的具体细节还是比较复杂的,有兴趣的牛u可以找找资料了解一下。
react的fiber树有两颗:
current fiber树: 当完成一次渲染之后,会产生一个current树,current会在commit阶段替换成真实的Dom树(可以看成虚拟dom转真实dom)。
workInProgress fiber树: 即将调和渲染的 fiber 树。再一次新的组件更新过程中,会从current复制一份作为workInProgress,更新完毕后,将当前的workInProgress树赋值给current树。
workInProgress tree上有一个memoizedState属性,在函数组件中,memoizedState在一次调和渲染过程中,以链表的形式存放hooks信息。
每一个hook函数执行,都会产生一个hook对象,里面存放了hook的当前信息,然后会以链表的形式串联每个hook对象,并赋值给workInProgress的memoizedState。
每次组件更新的时候,会先复制一份current tree到workInProgress tree,此时在workInProgress上进行更新。一旦在条件语句中声明hooks,在下一次函数组件更新,hooks链表结构,将会被破坏(某个节点可能被跳过),current树的memoizedState缓存hooks信息,和当前workInProgress不一致,如果涉及到读取state等操作,就会发生异常。
以上很多是自己的理解,可能讲述不准确但有助于自己理解,欢迎评论区留言指出错误~
#面经##前端##滴滴##4399##minimax##24届软开秋招面试经验大赏#
今天回顾一下我遇到的一些有价值的问题,结合我自己的一些理解对这些问题尝试解答一下,相信对大家一些知识的理解也会有些帮助(有问题的话欢迎指出)。
有用的话感谢大家点赞收藏送花~
1.(滴滴提前批二面)Vue开启了keep alive之后会经历哪些生命周期?缓存了什么东西?
这个点我自己是没有仔细思考过的,当时面试官提问vue的生命周期,我提到了Vue开启keep alive前后生命周期的不同,面试官拓展的问了这个问题。
背八股的时候都背过,使用
那么缓存了什么?我们知道在mounted阶段,虚拟DOM转为真实DOM,此时data,method,虚拟DOM都有了;而activated阶段可以不经历前面的钩子,直接挂载DOM,说明keep-alive缓存了虚拟DOM,并且还有所有的数据/方法,也就是缓存了组件实例。
如果面试阶段没有见过这个题,可以从每个生命周期干了什么开始联想,其中走到mounted阶段拥有了什么,那么actived阶段就也会有这些。
2.(4399一面)http1.1的情况下,一个网页的图片是一张一张加载还是一批一批加载的?
首先回顾一下http1.1的特性:
● 默认长连接,新增响应头Connection:keep-alive字段,保持TCP连接不断开
● 管道化:基于上面长连接的基础,管道化可以不等第一个请求响应继续发送后面的请求,但响应的顺序还是按照请求的顺序返回
● 缓存处理:新增catch-control字段
● 断点传输机制。文件传输时如果遇到网络故障,可以从已经上传/下载好的地方继续请求,不用从头开始
其中第二点提到的管道化基本可以解答整个问题,虽然可以发送多个请求,但是返回的顺序还是有序的。因此虽然TCP最大连接数有6~8个,但是返回时还是顺序返回的。
但是需要注意,如果严谨一点的话还是要考虑一下预加载的情况。例如,当浏览器解析到 HTML 中的标签时,它可能会提前发起对指定资源(包括图片)的请求,这样在真正需要显示该图片时,可能已经加载完成或者部分加载,从而在一定程度上出现看似一批加载的情况。
3.(Minimax一面)eval和new Function的this指向问题:
eval的this指向可以看这篇,很详细:https://ayk.moe/articles/javascript-change-this-in-eval-function/index.html
简单的说:eval函数只要是在全局直接运行或者是通过一个函数调用执行、作为对象属性被调用执行这种间接的执行方式,他的指向都是全局作用域。他不能直接被call/bind/apply改变this指向,改变的思路是在eval外面包一层函数,改变外面这个函数的this指向。
new Function:使用 new Function 创建的函数,它的 [[Environment]] 指向全局词法环境,而不是函数所在的外部词法环境。因此,我们不能在 new Function 中直接使用外部变量。
如果你对这块不熟悉,来看看这个:https://zh.javascript.info/new-function
4.(Minimax二面)React:在if else里书写hooks,为什么不可以?
我用我自己比较容易理解的话术来简述一下关键原因,这里面的具体细节还是比较复杂的,有兴趣的牛u可以找找资料了解一下。
react的fiber树有两颗:
current fiber树: 当完成一次渲染之后,会产生一个current树,current会在commit阶段替换成真实的Dom树(可以看成虚拟dom转真实dom)。
workInProgress fiber树: 即将调和渲染的 fiber 树。再一次新的组件更新过程中,会从current复制一份作为workInProgress,更新完毕后,将当前的workInProgress树赋值给current树。
workInProgress tree上有一个memoizedState属性,在函数组件中,memoizedState在一次调和渲染过程中,以链表的形式存放hooks信息。
每一个hook函数执行,都会产生一个hook对象,里面存放了hook的当前信息,然后会以链表的形式串联每个hook对象,并赋值给workInProgress的memoizedState。
每次组件更新的时候,会先复制一份current tree到workInProgress tree,此时在workInProgress上进行更新。一旦在条件语句中声明hooks,在下一次函数组件更新,hooks链表结构,将会被破坏(某个节点可能被跳过),current树的memoizedState缓存hooks信息,和当前workInProgress不一致,如果涉及到读取state等操作,就会发生异常。
以上很多是自己的理解,可能讲述不准确但有助于自己理解,欢迎评论区留言指出错误~
#面经##前端##滴滴##4399##minimax##24届软开秋招面试经验大赏#
全部评论
牛
相关推荐
11-06 00:25
华中科技大学 自然语言处理 点赞 评论 收藏
分享
11-13 21:10
哈尔滨工业大学(威海) C++ 点赞 评论 收藏
分享
查看16道真题和解析
点赞 评论 收藏
分享