每日五题（7）

1. 回调与promise

回调callback

被作为实参传入另一函数，并在该外部函数内被调用，用以完成某些任务的函数，称为回调函数。

即回调函数被作为一个参数传给另外一个函数，在这个函数执行时被调用执行。同时执行多个函数。

Promise

promise是一个对象，代表一个异步操作的最终结果（完成或失败）。
本质上promise是一个函数返回的对象，我们可以将回调函数绑定在上面，就不需要在一开始把回调函数作为参数传入了。
可以通过创建一个promise链来实现连续执行两个或者多个异步操作。

//promise对象在new创建且没有调用时，就会被执行。因此一般将其包在一个函数内，需要时运行。
function myRequest(type) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        let result = type + 1
        resolve(result)
      }, 1000)
    })
  }
  
// 链式调用(仅作示例，实际情况 myRequest 可能是不同的函数)
myRequest(0).then(res => {
	return myRequest(res)
}).then(res => {
    return myRequest(res)
}).then(res => {
    console.log(res) //3
})

// 或者
myRequest(0)
.then(res => myRequest(res))
.then(res => myRequest(res))
.then(res => {
    console.log(res) //3
})

两个特点：
1.对象的状态不受外界影响；Promise对象代表一个异步操作，有三种状态：pending(进行中)、fulfilled（已成功）、rejected（已失败）。只有异步操作的结果可以确定当前的状态
2.一旦状态改变，就不会再变，任何时候都可以得到这个结果。

状态改变的情况只有两种：pending ==> rejected
或者 pending ==> fulfilled
情况发生后，状态就凝固了，称为resolved （已定型）

Promise原型方法then, catch, finally

2. 回流与重绘

回流

当增加或删除dom节点、给元素修改宽高时，会改变页面布局，就会重新构造dom树然后再次进行渲染，就是回流。
由于回流是根据视口大小来计算元素的位置和大小的，所以浏览器窗口尺寸变化也会引起回流。

重绘

当给一个元素更换颜色、更换背景！虽然不影响页面布局，但会有样式的变化，就会重新渲染页面，就是重绘。

区别

• 重绘不会引起dom结构和页面布局的变化，只是样式的变化。
• 回流是引起dom结构和页面布局的变化。
• 有重绘不一定有回流，有回流一定有重绘。

3. vue3中watch、watchEffect区别

用watch监听数据状态时，只有当监听的数据源发生了变化，监听函数的回调函数才会执行。
有时候我们需要在刚进页面（第一次渲染页面）时，就将watch监听器里的回调函数执行一遍，依靠watchEffect监听器。

watchEffect不像watch那样接收一个明确的数据源，只接收一个回调函数。在这个回调函数中，会自动监听响应数据。在第一次进入页面时，响应数据从无到有，触发watchEffect的回调函数。

区别

• watch 和 watchEffect 都能监听响应式数据的变化，不同的是它们监听数据变化的方式不同。
• watch 会明确监听某一个响应数据，而 watchEffect 则是隐式的监听回调函数中响应数据。
• watch 在响应数据初始化时是不会执行回调函数的，watchEffect 在响应数据初始化时就会立即执行回调函数。

很清楚的文章！详细用法与区别

4. Get与Post区别

• post请求发送的数据更大，get请求有url长度限制（由浏览器和web服务器决定设置）
• post请求能发送更多的数据类型，get请求只能发送ASCII字符
• 传参方式不同，get请求通过url传递参数，post请求放在请求体中
• post请求更安全：post请求不会作为url的一部分，不会被缓存、保存在服务器日志、浏览器浏览记录中，get请求的是静态资源，会缓存
• get请求产生一个TCP数据包，post请求产生两个TCP数据包
  get与post都是HTTP的两种发送请求的方式，而HTTP是基于TCP/IP的关于数据如何在万维网通信的协议。HTTP的底层是TCP/IP，也就是说get和post的底层也是TCP/IP，即get、post本质上都是TCP链接，但是由于HTTP的规定和浏览器、服务器的限制，导致它们在应用过程中体现出不同。

Get请求的过程：

1. 浏览器请求TCP连接（第一次握手）
2. 服务器答应进行TCP连接（第二次握手）
3. 浏览器确认，并发送get请求头和数据（第三次握手，这个报文比较小，所以http会在此时进行第一次数据发送）
4. 服务器返回200 OK响应

Post请求的过程：
前三步同上
4. 服务器返回100 Continue响应
5. 浏览器发送数据
6. 服务器返回200 OK响应

网络环境好的时候，发一次包和发两次包的时间差别基本可以忽略。但在网络环境差的情况下，两次包的TCP在验证数据包完整性上有极大作用。

5. new关键字创建流程

1. 在内存中创建一个空对象
2. 用this指向这个对象
3. 执行构造函数的代码，给这个对象增加属性和方法
4. 返回这个对象

构造函数：如Stars(),抽离了对象的公共部分，封装到了函数里，泛指一大类(class)
对象：如 var ldt = new Stars(),特指具体的某一个，通过new关键字创建对象的过程我们也称之为对象的实例化