2022-03-08 面试总结

2022-03-08 本文已影响0人网恋被骗二块二

笔试部分：

meta 的 viewport 的作用，如何写？

device-width 是指这个设备最理想的 viewport 宽度
user-scalable 是否允许用户手动缩放页面
initial-scale 定义初始缩放比例
maximum-scale/minimum-scale 定义最大最小缩放比例
<meta name="viewport"
content="width=device-width,user-scalable=no,initial-scale=1.0,  
maximum-scale=1.0,minimum-scale=1.0">   
<!-- 换行请不要在意 -->

简述 tcp 的三次握手

客户端发起请求（SYN），服务端收到后应答（ACK）和发起请求（SYN），客户端收到后也回应（ACK）

面向对象编程的特征

封装、继承、多态

面试部分：

自我介绍、项目经历

主要问了项目经历，可能更想听到用了哪些技术，而不是做了什么。

vue.$set 的原理

参考博客1： https://www.cnblogs.com/yaxinwang/p/13827529.html?ivk_sa=1024320u
参考博客2： https://blog.csdn.net/weixin_42038290/article/details/114700728
参考博客3： https://blog.csdn.net/weixin_42192113/article/details/119117078?utm_medium=distribute.pc_relevant.none-task-blog-2_defaultbaidujs_baidulandingword~default-1.pc_relevant_default&spm=1001.2101.3001.4242.2&utm_relevant_index=4
个人理解是：

3个参数，target（对象或数组），key，val；
首先判断 target 是否为 null 或 undefined ，如果是，抛出异常；
其次判断 target 是否数组，是数组的话，判断 key 是不是一个有效的下标，都满足的话，再通过 splice 去修改数组；
如果 target 不是数组即是对象，先判断 key 是否存在，若存在直接修改（此步骤说明该 key 已经是响应式）。
不存在的话则先获取 target 的 __ob__ ，然后判断 target 是不是一个 vue 实例，是实例就抛出异常。
不是实例的话结合 ob 判断，ob 不存在则说明该属性不是响应式，直接修改，反之调用 defineReactive 注册为响应式，并且手动调用 ob.dep.notify() 更新

至于为什么要使用 vue.$set ？对于需要响应式的对象来说，直接添加个属性，是没有绑定 Object.defineProperty，也就无法触发响应式更新。

$nextTick 的原理

参考博客：https://www.cnblogs.com/xiaonian8/p/14092492.html
nextTick 会把回调函数放入一个内部的数组里，由 nextTickHandler来遍历执行。而这个函数的执行是异步的，什么时候执行取决于它是属于微任务还是宏任务。
同步任务执行完毕后，就会去异步任务里分别执行微任务和宏任务，nextTickHandler设置成宏任务或微任务后就会保证总是在数据修改完或 dom 更新后再执行。
macro(宏任务) task：同步代码、setImmediate、MessageChannel、setTimeout/setInterval
micro(微任务) task：Promise.then、MutationObserver
对于nextTickHandler，首先选择setImmediate，但setImmediate有兼容性问题，目前只支持 edge 和 ie，其次就是MessageChannel，再其次就是new Promise().then()设置成微任务，最后再考虑setTimeout。