面试题02--有讲解
wen 2022/8/23 面试题
# 1. 关于 OSI 七层模型和 TCP 四层模型
OSI分层：应用层、表示层、会话层、传输层、网络层、数据链路层、物理层。TCP/IP模型：应用层、传输层、网络层、网络接口层。
| OSI 七层网络模型 | TCP/IP 四层概念模型 | 对应网络协议 |
|---|---|---|
| 7：应用层 | 应用层 | HTTP、RTSP TFTP（简单文本传输协议）、FTP、 NFS（数域筛法，数据加密）、WAIS`（广域信息查询系统） |
| 6：表示层 | 应用层 | Telnet（internet远程登陆服务的标准协议）、Rlogin、SNMP（网络管理协议）、Gopher |
| 5：会话层 | 应用层 | SMTP（简单邮件传输协议）、DNS（域名系统） |
| 4：传输层 | 传输层 | TCP（传输控制协议）、UDP（用户数据报协议）） |
| 3：网络层 | 网际层 | ARP（地域解析协议）、RARP、AKP、UUCP（Unix to Unix copy） |
| 2：数据链路层 | 数据链路层 | FDDI（光纤分布式数据接口）、Ethernet、Arpanet、PDN（公用数据网）、SLIP（串行线路网际协议）PPP（点对点协议，通过拨号或专线方建立点对点连接发送数据） |
| 1：物理层 | 物理层 | SMTP（简单邮件传输协议）、DNS（域名系统） |
# 2. 前端数据加密
- Base64、MD5、AES、RSA：https://blog.csdn.net/u010059669/article/details/118494794 (opens new window)。
- Base64 -- 转码、MD5 -- 散列、AES -- 对称加密、RSA -- 非对称加密。
- 对称加密：加密密钥和解密密钥相同；非对称加密：加密密钥和解密密钥不相同。
# 3. typeof null 为什么是 ‘object’
- JavaScript 诞生以来便如此：
typeof null === 'object'。 - 在 JavaScript 最初的实现中，JavaScript 中的值是由一个表示类型的标签和实际数据值表示的。对象的类型标签是 0。由于
null代表的是空指针（大多数平台下值为 0x00），因此，null 的类型标签是 0，typeof null也因此返回"object"。（参考来源 (opens new window)） - 曾有一个 ECMAScript 的修复提案（通过选择性加入的方式），但被拒绝了 (opens new window)。该提案会导致
typeof null === 'null'。
# 4. 为什么要用 weakMap
- WeakMap 为弱引用，利于垃圾回收机制。一旦消除对该节点的引用，它占用的内存就会被垃圾回收机制释放。Weakmap 保存的这个键值对，也会自动消失。
- 总之，WeakMap的专用场合就是，它的键所对应的对象，可能会在将来消失。WeakMap结构有助于防止内存泄漏。
# 5. RAF 和 RIC 是什么
- requestAnimationFrame：告诉浏览器在下次重绘之前执行传入的回调函数(通常是操纵 dom，更新动画的函数)；由于是每帧执行一次，那结果就是每秒的执行次数与浏览器屏幕刷新次数一样，通常是每秒 60 次。
- requestIdleCallback：会在浏览器空闲时间执行回调，也就是允许开发人员在主事件循环中执行低优先级任务，而不影响一些延迟关键事件。如果有多个回调，会按照先进先出原则执行，但是当传入了 timeout，为了避免超时，有可能会打乱这个顺序。
# 6. vue 有哪些优点和特点
- 渐进式框架、轻量级框架、简单易学、双向数据绑定、组件化、MVVM。
# 7. webpack 基础配置
- entry：入口配置，webpack 编译构建时能找到编译的入口文件，进而构建内部依赖图。
- output：输出配置，告诉 webpack 在哪里输出它所创建的 bundle，以及如何命名这些文件。
- loader：模块转换器，loader 可以处理浏览器无法直接运行的文件模块，转换为有效模块。比如：css-loader 和 style-loader 处理样式；url-loader 和 file-loader 处理图片。
- plugin：插件，解决 loader 无法实现的问题，在 webpack 整个构建生命周期都可以扩展插件。比如：打包优化，资源管理，注入环境变量等。
# 8. WEB 应用从服务器主动推送 Data 到客户端有哪些方式
- 轮询。
- WebSocket。
# 9. 常用 hack 的技巧
- 浏览器兼容性问题：出现浏览器兼容性问题的主要原因，是不同浏览器对同一段代码的有不同解析，造成的页面显示效果不统一。
- 什么是 css hack：不同的浏览器对 css 的解析结果是不同的，因此会导致相同的 css 输出的页面效果不同，这就需要 css hack 来解决浏览器局部的兼容性问题。而这个针对不同的浏览器写不同的 css 代码的过程，就叫 css hack。
- 参考：https://juejin.cn/post/6993336485952880671 (opens new window)。
# 10. 所有的对象都有原型吗
- 不是的，
Object.create(null)-- > 创建的对象没有原型。 Object.create({...})-- > 可以指定原型。
# 11. 三次握手和四次挥手
- 三次握手：【1】第一步：客户端发送 SYN 报文到服务端发起握手，发送完之后客户端处于 SYN_Send 状态；【2】第二步：服务端收到 SYN 报文之后回复 SYN 和 ACK 报文给客户端；【3】第三步：客户端收到 SYN 和 ACK，向服务端发送一个 ACK 报文,客户端转为 established 状态，此时服务端收到 ACK 报文后也处于established 状态，此时双方已建立了连接。
- 四次挥手：刚开始双方都处于 establised 状态，假如是客户端先发起关闭请求，则：【1】第一次挥手：客户端发送一个 FIN 报文，报文中会指定一个序列号。此时客户端处于 FIN_WAIT1 状态。【2】第二次挥手：服务端收到 FIN 之后，会发送 ACK 报文，且把客户端的序列号值 + 1 作为 ACK 报文的序列号值，表明已经收到客户端的报文了，此时服务端处于 CLOSE_WAIT状态。【3】第三次挥手：如果服务端也想断开连接了，和客户端的第一次挥手一样，发给 FIN 报文，且指定一个序列号。此时服务端处于 LAST_ACK 的状态。【4】第四次挥手：客户端收到 FIN 之后，一样发送一个 ACK 报文作为应答，且把服务端的序列号值 + 1 作为自己 ACK 报文的序列号值，此时客户端处于 TIME_WAIT 状态。需要过一阵子以确保服务端收到自己的 ACK 报文之后才会进入 CLOSED 状态。【5】服务端收到 ACK 报文之后，就处于关闭连接了，处于 CLOSED 状态。
