前端知识粉碎机

diff算法

Dep的作用是收集观察者以及当数据发生变动时通知观察者去更新。
Dep.notify()通知观察者去更新。
当数据改变时，就会触发setter，然后触发Dep.notify，通知订阅者，比对新旧虚拟节点，判断是否是同类标签，如果不是同类标签，直接替换，如果是同类标签，判断新旧虚拟是否相等，相等直接return，不相等的话再分情况比较。如果新旧虚拟节点都有文本节点，用新的文本替换旧文本。旧虚拟节点没有子节点，新虚拟节点有子节点，增加新的子节点。
旧虚拟节点有子节点，新虚拟节点没有子节点，删除旧的子节点。新虚拟节点和旧虚拟节点都有子节点，进行子节点更新。

比较顺序是 oldStart与newStart—>oldStart与newEnd—>oldEnd与newStart—>oldEnd与newStart 依次比较，直到比较成功后退出当前比较，渲染结果以newVnode为准，每次比较成功后start和end向中间靠拢，当新旧节点中有一个start点跑到end点右侧时终止比较，如果都匹配不到，则旧虚拟DOM key值去比对新虚拟DOM 的key值，如果key相同则复用，并移动到新虚拟DOM的位置。

JS执行机制

JS是单线程语言，分为同步和异步。
同步不需要等待。
异步需要等待一会儿例如setTimeout，网络请求等。
异步任务分为宏任务和微任务

宏任务不需要立即连贯执行。例如script setTimeout setInterval setImmediate
微任务需要立即连贯执行。例如new Promise().then process.nexTick

HTTP缓存

HTTP缓存使网页打开速度更快，使服务器压力减小。
Expires 设置过期时间

Exprise时间是服务端返回的，比对的确实客户端时间，服务端与客户端时间不一致怎么办？
Cache-Control 采用过期时长

除了max-age指令外，还有一些其他常用指令。

当服务器压力太大，缓存又过期了怎么办？

缓存分为强缓存和协商缓存。
强缓存就是在缓存没有过期的时候，浏览器可以直接决定使用缓存。

协商缓存，当缓存过期时，浏览器咨询服务器时候可以使用缓存，服务器返回可以使用或者不可以使用。

如何协商缓存过程？

浏览器向服务器发送浏览器请求，服务器返回最后修改时间，浏览器以后每次请求，都带上这个值，然后服务器去比对服务端资源最后修改时间，如果不过时，可以用，返回304。如果过时了，正常返回新的资源，返回200状态。
但是Last-Modified是以秒记录的，服务器对一秒内改变无感，会造成有新资源改变却返回没有改变的问题。
用ETag

DNS域名解析过程

DNS域名解析分为本地解析和互联网域名服务器解析。首先是本地解析，现在浏览器中查看是否有DNS缓存，如果没有再去操作系统查看是否有DNS缓存，如果没有再去本地HOST文件查看。然后是物联网域名服务器解析，询问本地NDS服务器知道www.sixue.com的IP地址吗，先去本地DNS服务器缓存查看，如果没有，去询问根服务器，根服务器让本地DNS服务器去询问COM顶级域名服务器，COM顶级域名服务器让本地DNS服务器询问sixue.com权威域名服务器，sixue.com权威域名服务器找到ID地址返回给本地DNS服务器，再告诉客户端。

TCP三次握手

客户端主动开启SYN-SEND,服务端被动开启SYN-RCVD。
客户端向服务端发送SYN=1建立新连接，seq=x 随机序列号值为x ，服务端收到后，再向客户端发送SYN=1代表同意建立新连接，ACK=1确认序列号有效，seq=y随机序列号值为y，ack确认值为x+1。然后客户端再向服务端发送ACK=1代表确认序列号y值有效，seq=x+1序列号为原先的x值+1,ack=y+1确认服务端发送的序列号y值有效，就+1。然后就可以进行数据传输了。

学会使用Promise

这就是回调地域。
promise 优雅的去表示异步回调


只能由pending转为fulfilled或者rejected
不能由fulfilled或者rejected的变灰pending

then支持链式调用

简化业务需要


finally 无论是fullfilled还是rejected 都会执行。
all 所有都fullfilled 才会执行 有一个rejected都不行
allSettled 所有的有结果就会执行，无论fullfilled还是rejected
any 任意一个fullfilled就会执行
race 任意一个fullfilled或者rejected就会执行。
reject 返回一个状态为rejected的promise对象

递归算法

斐波那契数列

快速排序

快速排序的特点是每次找一个基准值，比基准值小的排基准值左侧，大的排基准值右侧。

了解XSS攻击与防范

XSS—侧重于脚本，千方百计的注入并执行恶意脚本。
CSRF----不注入恶意脚本，侧重于请求伪造，借刀杀人，在用户不知情的情况下，借用户的名义干坏事。



预防
先注入再执行 ，防止注入，防止执行。

手写promise及原理

算了吧 太多了

防抖和节流

防抖 回城

节流 CD

for in 和 for of的区别

for in 遍历的是数组的索引，for of 遍历的是数组元素值（value）
推荐在遍历对象的时候使用for in,在遍历数组的时候使用for of
for of 不能循环普通的对象，需要通过Object.keys搭配使用

对象不是可迭代对象 不能用for of

Object.keys

 const obj = {
        nickname: "sss",
        age: 18,
        gender: "女",
      };

      // 第一种
      const keys = Object.getOwnPropertyNames(obj);
      console.log(keys);

      for (let key of keys) {
        console.log(obj[key]);
      }

      // 第二种
      for (let key in obj) {
        console.log(obj[key]);
      }

      // 第三种
      const keys1 = Object.keys(obj);
      console.log(keys1);

      for (let key of keys1) {
        console.log(obj[key]);
      }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

Set和Map