前端面试笔记 --（一）

以下回答是参考其他文档、chat-GPT和自己的理解编写的答案，不一定完全正确，仅提供参考

1. 深拷贝与浅拷贝、实现方法（通常只问深拷贝的方法）

前置知识：数据类型分为基本数据类型（String、Number、Boolean、Null、Undefined、Symbol）和引用数据类型(Object、Array、Function、Date、RegExp等)

基本数据类型的特点：直接存储在栈中的数据；
引用数据类型的特点：栈中存储对象的引用（内存地址）、堆中存放真实的数据；
引用数据类型在栈中存储了指针，该指针指向堆中该实体的起始地址。当解释器寻找引用值时，会首先检索其在栈中的地址，取得地址后从堆中获得实体。

参考文章：深拷贝与浅拷贝

答：深拷贝与浅拷贝只针对于引用数据类型，浅拷贝只复制指向某对象的指针、而不复制对象本身，新旧对象共享一块内存。深拷贝会另外创造一个一模一样的对象，与原对象不共享内存，修改新对象不会修改到原对象；浅拷贝方法Object.assign()、Array.prototype.concat()、Array.prototype.slice();深拷贝：JSON.parse(JSON.stringify())、手写递归方法.

2.vue双向绑定的原理

答：双向绑定指的是数据模型（Model）和视图（View）之间的双向同步。vue2的双向绑定依赖于Object.defineProperty()方法，在实例vue时，遍历data对象中的属性，并使用Object.defineProperty()将属性转化为getter、setter。当时数据发生变化时，setter就会被触发，并通知依赖此数据的Watcher进行更新，watcher在Vue中负责监听数据的变化，在数据发生变化时执行相应的操作。vue3通过es6中新增的一种反射机制Proxy实现双向绑定，它会在目标对象之前架设一层“拦截”，来实现更深层的数据监听和更高效的更新。当数据发生变化时，Proxy会触发相应的更新操作，来高效灵活的双向绑定。

3.原型和原型链

参考文档：原型与原型链

答：在js中每个函数类型的数据都有一个叫prototype的属性，该属性指向一个对象，就是原型对象，（原型对象都有一个constructor的属性，指向的是它的构造函数），原型的作用是用来存放实例对象的公有属性和公有方法，所有原型对象都是Object()的实例，原型链又叫隐式原型链，使用_proto_属性串联起来，原型链的尽头是null.（隐式原型链：利用_proto_属性查找原型，该属性指向的是当前对象构造函数的原型）

4.http与https

答：http（超文本传输协议）是互联网上应用最广泛的一种网络协议，用于从www服务器传输超文本至本地浏览器的传输协议，能让浏览器更高效的工作、减少网络传输量，https是以安全为目标的http通道，通过传输加密和身份认证保证了安全；1.安全方面：http的传输数据采用未加密的明文、https:需要ca证书、在http基础上添加ssl/tls加密协议，对传输的数据进行加密；2.建立连接：http建立连接快，客户端发送请求、服务端响应后，连接即断开，https需要ssl/tls握手，建立安全通信通道，握手完成后喜爱能进行http通信；3.默认端口，http默认80,https默认443;4.网站优化，https会比http的搜索结构排名优先，可以提高网站的可见性与流量；

5.防抖与节流

参考：防抖与节流

答：防抖：多次触发只执行一次。场景：搜索时，用户不停输入值，通过防抖来节省资源；节流：规定时间只能执行一次，场景：鼠标不断点击事件

6.TCP三次握手与四次挥手

答：
三次握手是建立TCP连接的过程
1.客户端向服务器发送一个SYN报文，请求建立连接；
2.服务器收到SYN报文后，回复SYN+ACK报文，表示收到客户端请求，并请求客户端确认；
3.客户端收到SYN+ACK报文后，回复ACK报文，完成连接建立。
三次握手主要目的是确保客户端和服务端之间的连接是可靠和稳定的，可以开始传输数据；
四次挥手是断开TCP连接的过程。
1.客户端向服务端发送FIN报文，请求断开连接；
2.服务端接收到FIN报文，回复ACK报文，确认收到客户端断开请求；
3.服务端在完成数据传输后，向客户端发送FIN报文，请求客户端断开连接；
4.客户端收到FIN报文后，回复ACK报文，确认断开连接；
四次挥手的目的是确保双方都能正常关闭连接，并释放相应资源。