//自己总结着玩，发上来方便查看

JS部分

JS基础

1. 类型判断问题
   原始数据类型除了null以外使用 typeOf 即可判断，引用数据类型使用 instanceOf 即可判断;
   instanceOf通过原型链查询;
2. Object.is 和 === 的区别
   在全等的基础上增加了对 +0和-0 以及NaN和NaN的正确处理;
3. == 和 ===区别
   === 先比较类型再比较值，都相同为true
   == 如果类型不同，会进行转换再比较值
   1. 先比较类型，如果类型相同，则比较值
   2. 是否两端是null和undefined，返回true
   3. 是否是String和Number对比，String转Number
   4. 是否有一端为布尔值，转为Number再对比
   5. 一端Object，另一端布尔、String、Symbol，会将Object转为字符串再比较
4. 对象转原始类型的过程
   调用[ToPrimitive]函数，它的逻辑如下
   1. 调用 Symbol.toPrimitive ，如果返回原始值则返回
   2. 调用ValueOf()，如果返回原始值就返回
   3. 调用toString()，如果返回原始值就返回
5. 如何使( a ==1 && a == 2 )为true
   let a = { value: 0, ValueOf(){ this.value ++, return this.value } }
6. 什么是闭包
   有权访问另一个函数作用域变量的函数。
   产生原因：当前函数存在对父级作用域变量对引用。
   闭包的表现形式：
   1. 函数作为返回值
   2. 函数作为参数传递
   3. IIFE自执行函数创建闭包，当前作用域和全局作用域
   4. 回调函数
7. 原型
   原型对象和构造函数的关系
   构造函数的protoType属性指向原型对象，new 出的实例的__proto__属性指向原型对象
   原型链
   当引用对象的某个属性时，会先在自身属性查找，没有就去找__proto__属性，没有就继续找，直到null也没有则不存在
8. new 操作符的含义
   1.新建一个对象obj
   2.设置原型链
   3.将构造函数this指向obj并执行构造函数体
   4.判断第三步的结果是否为引用值，如果是引用值则返回这个值，反之则返回obj
9. js every和some
   every遍历数组都返回true则返回true
   some有一项返回true则返回true
10. this指向问题
    箭头函数没有this，继承自上层代码块的this指向
    apply，call，bind绑定this
    new 操作符将this绑定在实例上
    对象.方法把this绑定在对象上
    直接调用指向全局，严格模式指向undefined （use strict）
11. symbol
12. Gener

Vue部分

1. MVVM和MVC的区别
   MVVM框架解决了MVC框架大量操作dom造成操作繁琐且影响性能的问题，以及Model和View层的变化都需要开发者手动进行更新使C层成为很难维护复杂多变的数据状态。而MVVM中的ViewModel部分通过双向绑定将View层和Model层的相互影响更新封装（Model层变化会立即同步到View，View的变化也会立即作用到Model层），不需要开发者经常操作dom（只需要告诉VM view层和哪个model有联系即可），而且使View层和Model层能够独立出来。
2. Vue响应式原理
   使用数据劫持+发布订阅模式实现，观察者watcher类会包含视图更新方法以及改变订阅者指向，订阅者dep用来收集依赖watcher和派发更新（触发watcher的视图更新方法），使用Object.defineProperty劫持数据的get、set方法。具体流程是vue实例过程中会遍历data中的对象的所有属性，通过Object.defineProperty劫持get和set，get方法将实例dep类，把vue实例的watcher存在dep中，set方法中会调用dep的派发更新方法调用watcher中的更新视图方法。

Http/Https协议部分

1. 常用状态码总结
   1xx：当前处于协议处理的中间状态，还需要后续操作
   101 Switching Protocols，在http升级到websocket时，如果服务器同意变更就会发送101状态码
   2xx：表示成功状态
   200 OK是见得最多的成功状态码。通常在响应体中放有数据。
   204 No Content含义与 200 相同，但响应头后没有 body 数据。
   206 Partial Content顾名思义，表示部分内容，它的使用场景为 HTTP 分块下载和断点续传，当然也会带上相应的响应头字段Content-Range。
   3xx：重定向状态，资源发生变动，需要重新请求
   301 Moved Permanently即永久重定向，对应着302 Found，即临时重定向。
   比如你的网站从 HTTP 升级到了 HTTPS 了，以前的站点再也不用了，应当返回301，这个时候浏览器默认会做缓存优化，在第二次访问的时候自动访问重定向的那个地址。
   而如果只是暂时不可用，那么直接返回302即可，和301不同的是，浏览器并不会做缓存优化。
   304 Not Modified: 当协商缓存命中时会返回这个状态码。详见浏览器缓存
   4xx：请求报文有错误
   400 Bad Request: 开发者经常看到一头雾水，只是笼统地提示了一下错误，并不知道哪里出错了。
   403 Forbidden: 这实际上并不是请求报文出错，而是服务器禁止访问，原因有很多，比如法律禁止、信息敏感。
   404 Not Found: 资源未找到，表示没在服务器上找到相应的资源。
   405 Method Not Allowed: 请求方法不被服务器端允许。
   406 Not Acceptable: 资源无法满足客户端的条件。
   408 Request Timeout: 服务器等待了太长时间。
   409 Conflict: 多个请求发生了冲突。
   413 Request Entity Too Large: 请求体的数据过大。
   414 Request-URI Too Long: 请求行里的 URI 太大。
   429 Too Many Request: 客户端发送的请求过多。
   431 Request Header Fields Too Large请求头的字段内容太大。
   5xx：服务端错误
   500 Internal Server Error: 仅仅告诉你服务器出错了，出了啥错咱也不知道。
   501 Not Implemented: 表示客户端请求的功能还不支持。
   502 Bad Gateway: 服务器自身是正常的，但访问的时候出错了，啥错误咱也不知道。
   503 Service Unavailable: 表示服务器当前很忙，暂时无法响应服务。

2. cookie总结
   cookie是什么：cookie是存储在客户端的随着下一次请求自动发送给服务端的一小块数据，主要用于维持状态，因为http是无状态协议，服务端不知道两次请求是否来自同一个浏览器，cookie告诉
   服务端两次请求来自同一个浏览器。
   cookie怎么发送：服务端接收到客户端请求时，把cookie放在响应头中的setCookie中发送给客户端作为登陆标识，客户端收到后会存在浏览器缓存中，下次请求相同服务器时会带上cookie，
   服务端即可确认登陆状态。
   cookie属性：name ；value ；domain:可访问的域名；path 路由；Expires/Max-Age: 到期时间/存活的秒数，默认为session，关闭窗口就会删除；secure: true只会在安全协议中
   传输； httpOnly: 不能通过document.cookie获取cookie
   cookie的缺点：
   容量缺陷：Cookie 的体积上限只有4KB，只能用来存储少量的信息。
   性能缺陷：Cookie 紧跟域名，不管域名下面的某一个地址需不需要这个 Cookie ，请求都会携带上完整的 Cookie，这样随着请求数的增多，其实会造成巨大的性能浪费的，
   因为请求携带了很多不必要的内容。但可以通过Domain和Path指定作用域来解决。
   安全缺陷：由于 Cookie 以纯文本的形式在浏览器和服务器中传递，XSS攻击很容易被非法用户截获，然后进行一系列的篡改，在 Cookie 的有效期内重新发送给服务器，这是相当危险的。
   另外，在HttpOnly为 false 的情况下，Cookie 信息能直接通过 JS 脚本来读取。

3. http缓存
   浏览器中的缓存作用分为两种情况，一种是需要发送HTTP请求，一种是不需要发送。
   首先是检查强缓存，这个过程不需要发送http请求。http/1.0当中靠Expires来检查，Expires存在于服务端响应头中，标明了缓存的过期时间。当浏览器要继续发送该请求时会对比当前时间和过期时
   间，没过期命中，过期了发送http请求进入协商缓存阶段（缺陷，服务端和客户端时间有可能不同）。http/1.1当中使用Cache-control来判断，也存在于响应头当中，使用max-age字段标明了缓存的存活时间，秒为单位，表示未来的多长时间可以使用缓存。过期进入协商缓存。
   协商缓存，强缓存失效后，浏览器发送http请求时会携带相应的缓存标签用来给服务端判断是否命中协商缓存。缓存标签分为两种。
   Last-Modified：
   即最后修改时间。在浏览器第一次给服务器发送请求后，服务器会在响应头中加上这个字段。浏览器接收到后，如果再次请求，会在请求头中携带If-Modified-Since字段，
   这个字段的值也就是服务器传来的最后修改时间。服务器拿到请求头中的If-Modified-Since的字段后，其实会和这个服务器中该资源的最后修改时间对比:如果请求头中的这个值小于最后修改时间，说明是时候更新了。返回新的资源，跟常规的HTTP请求响应的流程一样。否则返回304，告诉浏览器直接用缓存。
   ETag：
   服务器根据当前文件的内容，给文件生成的唯一标识，只要里面的内容有改动，这个值就会变。服务器通过响应头把这个值给浏览器。浏览器接收到ETag的值，会在下次请求时，
   将这个值作为If-None-Match这个字段的内容，并放到请求头中，然后发给服务器。服务器接收到If-None-Match后，会跟服务器上该资源的ETag进行比对:如果两者不一样，说明要更新了。返回新的资源，跟常规的HTTP请求响应的流程一样。否则返回304，告诉浏览器直接用缓存。
   缓存位置：
   Service Worker:其中的离线缓存就是 Service Worker Cache。
   Memory Cache:指的是内存缓存，从效率上讲它是最快的。但是从存活时间来讲又是最短的，当渲染进程结束后，内存缓存也就不存在了。比较大的JS、CSS文件会直接被丢进磁盘，反之丢进内存
   内存使用率比较高的时候，文件优先进入磁盘
   Disk Cache:就是存储在磁盘中的缓存，从存取效率上讲是比内存缓存慢的，但是他的优势在于存储容量和存储时长。
   Push Cache:即推送缓存，这是浏览器缓存的最后一道防线。它是 HTTP/2 中的内容

4. 请求报文和响应报文组成

5. http/2有何改进

6. 有哪些请求方法，get和post的区别

7. 跨域
   浏览器的同源策略，不同源站点会有一些限制（1.不能访问和修改对方dom 2.不能访问对方cookie和indexDB和LocalStorage 3.限制XMLHttpRequest）。对于跨域请求，AJAX可以发出，服务端也可以进行响应，但是响应头如果未设置CORS就会被丢弃；下面介绍三种跨域解决方法
   1、CORS：简单请求（1.GET/POST/HEAD 2.Accept、Accept-Language、Content-Language、Content-Type(只限于三个值application/x-www-form-urlencoded、
   multipart/form-data、text/plain)）和非简单请求。非简单请求会先发送一个OPTION请求给服务端表明非简单请求的方法和请求头，如果服务端响应头中允许这个方法和请求头才会继续发送请求，不然会被拦住，因为非简单请求比简单请求带给服务器的压力大很多。之后流程和简单请求一样：它会自动在请求头当中，添加一个Origin字段，用来说明请求来自哪个源。服务器拿到请求之后，在回应时对应地添加Access-Control-Allow-Origin字段，如果Origin不在这个字段的范围中，那么浏览器就会将响应拦截。
   2、JSONP：利用script标签不受同源策略影响的特点，在src参数中写入url，会发送get请求，并且带着一个回掉方法，服务端在响应时把数据放入回掉函数中，浏览器调用这个回调函数
   即可获取数据
   3、Nginx反向代理：Nginx 相当于起了一个跳板机，这个跳板机的域名和客户端的域名一样，让客户端首先访问跳板，这当然没有跨域，然后 Nginx 服务器作为反向代理，
   将请求转发给目标服务器，当响应返回时又将响应给到客户端，这就完成整个跨域请求的过程。

8. https如何加密/TLS是什么，如何握手
   对称加密：加解密密钥相同；非对称加密：A、B两个密钥。用A加密则用B解密，用B加密则用A解密；
   历史过程和缺陷：使用对称加密算法通过明文传输两个随机数生成密钥，安全性低，黑客可获取密钥；使用非对称加密，公钥加密密钥，只有服务端私钥可解，可是会造成加密解密时间过长；后来使用非对称和对称相结合的方式，使用对称加密生成密钥，非对称加密传递密钥，但无法确定服务端的身份；后来引入安全证书都解决了；
   tsl最新握手过程：
   客户端发送加密套件列表和随机数1；
   服务端收到发送证书加密套件和随机数2；
   客户端验证证书后生成随机数3把随机数3使用公钥加密发送给服务端，并使用加密套件生成密钥secret；
   服务端使用私钥解密随机数3并发送确认信息使用加密套件生成密钥；

TCP/IP

1. UDP和TCP的区别
   UDP是面向无连接的、UDP有一定的不可靠性：不管接收方能否收到完整有序的报文，而且没有任何的拥塞处理算法导致在网络不稳定的情况下会发生丢包，不会对数据进行备份和排序收到什么就发送什么。不过这同时也体现了UDP的优点，它比TCP要轻便快速，在实时性要求比较高的场景应用较多比如直播、网络游戏。而且UDP支持一对一、一对多、多对多多对一多种场景。TCP每次连接和断开连接都需要握手，可以确保数据有序不丢失的到达。
2. TCP三次握手
   第一次
   刚开始客户端和服务端都是CLOSED状态，客户端发出SYN包请求连接（其中包含初始序列号seq，ACK确认位0，SYN为1）变为SYN_SEND状态；
   第二次
   服务端收到后会把客户端IP放入半连接队列并且发送SYN+ACK确认包（其中包含初始序列号seq，确认序列号ack=客户端seq+1表示收到确认号之前的报文，确认号ACK为1，SYN为1）然后服务端进入SYN_RECEIVED状态；
   第三次
   客户端收到服务端确认报文后，发出ACK确认报文（包含确认号ACK为1，确认序列号为服务端序列号+1）进入ESTABLISHED状态，服务端收到客户端确认包后也会进入ESTABLISHED状态，并把连接放入全连接队列。
3. 为什么要三次握手，两次明明已经可以建立连接了啊？
   三次握手才能确定客户端和服务端的收发能力正常；
   主要是为了防止客户端超时请求连接报文被服务端接受而再次进入ESTABLISHED状态，而此时客户端已经CLOSE，服务端一直等待客户端数据，造成资源浪费
4. 什么是SYN攻击
   攻击者使用大量假IP向服务端发送SYN包请求连接，会导致服务端一直向假IP发送ACK+SYN确认包且半连接队列爆满，丢失掉真正的请求。可以通过增大半连接队列长度，减少超时重传次数解决问题。
5. TCP四次挥手
   第一次挥手
   客户端向服务端发送FIN包释放连接请求，（包含FIN=1，ACK=0，seq=x），客户端进入FIN_WAIT1状态
   第二次挥手
   服务端收到客户端释放连接请求，通知应用层要释放TCP连接，给客户端发送ACK确认包（包含ACK=1，ack=x+1），进入CLOSE_WAIT状态；表明此时a到b的连接已断开，不会再接受a的数据
   第三次挥手
   服务端报文发送完毕，准备断开链接，给客户端发送FIN包（包含FIN=1，seq=y，ack=x+1）请求释放连接，进入LAST_ASK状态
   第四次挥手
   客户端收到服务端释放连接请求后，发送ACK确认包进入TIME_WAIT状态，等待2MSL（报文最大存活时间，确保服务端收到自己的确认，如果未收到就断开连接，服务端会一直等待客户端的确认，导致服务端不能正常关闭）后进入CLOSE状态，服务端收到确认包也会断开连接。
6. TCP怎么保证数据正确到达
   使用ARQ协议（超时重传协议）
   停止等待ARQ
   报文丢失：每次发送完报文都要停止发送并打开一个定时器，在定时器范围内没收到应答就再次发送之前的数据；报文发送问题时，接收端会丢弃报文等待发送端重传；
   ACK丢失：对端传输的应答丢失时，发送端依然会发送之前的报文，接收端会丢弃报文并发送应答报文，直到接收到新的报文；
   定时器设置大于一个RTT（报文从发送出去到接收到对端响应的时间）；
   连续ARQ
   发送端有一个发送窗口，一直在窗口范围内发送数据；接收端接收时不会一次一确认，而是等待一段报文后一起确认，ACK位为有序报文的最后一个序号，表示这个序号接收到了，请发送之后的数据；
7. TCP滑动窗口和拥塞处理
   滑动窗口（解决丢包，数据顺序不对以及流量控制问题）
   TCP中发送端和接收端各维护着一个窗口，发送窗口和接收窗口，发送窗口包含已发送但未得到确认的数据和可以发送但未发送的数据；发送窗口的大小
   是由接收方接收窗口的剩余大小决定的；接收方会把窗口剩余大小放入应答包中发送给发送方，发送方根据大小以及网络情况确定发送窗口的大小；这样确保了接收方能够接收到数据，避免了接收方带宽已满但发送方仍在发送的问题；接收方为0窗口时，发送方会设定定时器，定时询问接收方窗口大小，若超过一定次数会中断TCP连接；
   拥塞处理（防止过多数据拥塞网络，保证长时间稳定的在不同网络环境中较好的传输数据）
   拥塞处理
   慢开始算法
   1. 将发送窗口设为1MSS（1分段最大数据量）
   2. 每过一个RTT将窗口大小乘2
   3. 有一个阀值限制，超过阀值启动拥塞避免算法
   拥塞避免算法
   每过一个RTT把窗口大小+1
   当定时器超时时将认定网络拥塞进行以下步骤
   1. 将阀值设置为当时窗口的一半
   2. 发送窗口设置为1MSS
   3. 启动拥塞避免算法
   快速重传
   当报文失序时，接收方会发送最后一个有序的序号作为应答，当发送端收到三个相同的ACK时，不等待定时器结束，立即启动快速重传算法
   TCP Taho
   1. 阀值设置为当前一半
   2. 窗口为1MSS
   3. 启动慢启动算法
   TCP Reno
   1. 发送窗口减半
   2. 阀值设置为当前拥塞窗口
   3. 进入快恢复算法
   4. 启动拥塞避免算法
   TCP New Ren 改进后的快恢复
   TCP New Reno 算法改进了之前 TCP Reno 算法的缺陷。在之前，快恢复中只要收到一个新的 ACK 包，就会退出快恢复。
   在 TCP New Reno 中，TCP 发送方先记下三个重复 ACK 的分段的最大序号。
   假如我有一个分段数据是 1 ~ 10 这十个序号的报文，其中丢失了序号为 3 和 7 的报文，那么该分段的最大序号就是 10。发送端只会收到 ACK 序号为 3 的应答。这时候重发序号为 3 的报文，接收方顺利接收的话就会发送 ACK 序号为 7 的应答。这时候 TCP 知道对端是有多个包未收到，会继续发送序号为 7 的报文，接收方顺利接收并会发送 ACK 序号为 11 的应答，这时发送端认为这个分段接收端已经顺利接收，接下来会退出快恢复阶段。
   快恢复
   重传丢失报文，收到一个新的ACK就结束

浏览器部分

1. 从输入url到看到页面发生了什么
   DNS解析
   TCP握手
   TLS握手
   http/https请求
   解析请求到的HTML（浏览器渲染）

2. 重绘和回流

3. 进程和线程
   进程是一个程序的运行实例，当一个程序运行时操作系统会给分配给它一部分内存用于存储代码，运行时的数据和一个执行任务的主线程，
   这个运行环境就是进程；进程可以使用多线程并行处理提升运算效率；线程依附于进程不能单独存在，由进程启动和管理；
   进程特点：
   1.进程之间独立运行相互隔离，一个崩溃不会影响其他进程，可通过IPC通讯；
   2.线程之间共享进程数据；
   3.一个线程的崩溃会影响整个进程的崩溃；
   4.当进程关闭时浏览器会释放它的内存；

4. 浏览器进程
   浏览器进程。主要负责界面显示、用户交互、子进程管理，同时提供存储等功能。
   渲染进程。核心任务是将 HTML、CSS 和 JavaScript 转换为用户可以与之交互的网页，排版引擎 Blink 和 JavaScript 引擎 V8 都是运行在该
   进程中，默认情况下，Chrome 会为每个 Tab 标签创建一个渲染进程。出于安全考虑，渲染进程都是运行在沙箱模式下。
   GPU 进程。其实，Chrome 刚开始发布的时候是没有 GPU 进程的。而 GPU 的使用初衷是为了实现 3D CSS 的效果，只是随后网页、Chrome 的 UI
   界面都选择采用 GPU 来绘制，这使得 GPU 成为浏览器普遍的需求。最后，Chrome 在其多进程架构上也引入了 GPU 进程。
   网络进程。主要负责页面的网络资源加载，之前是作为一个模块运行在浏览器进程里面的，直至最近才独立出来，成为一个单独的进程。
   插件进程。主要是负责插件的运行，因插件易崩溃，所以需要通过插件进程来隔离，以保证插件进程崩溃不会对浏览器和页面造成影响。
   多进程架构优点：提升了稳定性，安全性，流畅性；缺点：更高的资源占用，每个渲染进程中都有V8引擎；更复杂的体系结构，各个模块耦合性较高；

V8引擎

1. 垃圾回收

2. 事件循环

3. 数据如何存