2022前段面试基础

1、域名解析
　　当我们在浏览器中输入一个url,比如“www.google.com”时，这个地址并不是谷歌网站真正意义上的地址。
      互联网上每一台计算机的唯一标识是它的IP地址，因此我们输入地址首先需要解析为IP地址，这个过程叫NDS解析。
2、TCP连接
　　HTTP协议是使用TCP协议作为其传输层协议，在拿到服务器的IP地址后，浏览器客户端会与服务器建立TCP连接。
其过程包括三次握手；
3、浏览器发送HTTP请求
　　浏览器构建HTTP报文请求。通过TCP协议传送到服务器的指定端口。HTTP请求报文一共包括三部分：
　　请求行+请求头+数据体（域名+协议+端口号）
4、服务器处理HTTP请求
　　服务器处理http请求，并返回响应报文。
　　（1）状态码：http服务常用的状态码及其含义如下：
    状态码 含义 常见示例
　　1** 　　服务器已经接受到请求， 客户端可继续发送请求
　　2** 　　请求成功 　　　　　200：请求已成功，请求所希望的响应头或数据体将随此响应返回。
　　3** 　　重定向　　　　　　 303：对应当前请求的响应可以在另一个 URI 上被找到，而且客户端应当采用GET的方式访问那个资源。
　　4**        客户端错误 　　　   404：请求的网页不存在
　　5** 　　服务器错误 　　　　503： 服务器超时
5、浏览器页面渲染
　　浏览器接受HTTP服务端发送过来的响应报文，并开始解析HTTP文档，渲染页面。
6、断开TCP连接。
　　四次挥手

1.vue 生命周期
created 可以获取到data中的数据 不能获取真实dom
常用于发起网络请求和注册全局的事件

真实dom挂载之前 beforeMounted()
预处理data，不会触发updated钩子函数
真实dom挂载以后 mounted() 可以获取到真实dom了

更新 data数据改变才执行
updated钩子 当数据发生改变并更新页面后 可以获取真实dom
销毁destoryed 移除全局事件，移除当前组件，计时器，定时器 ， eventBus移除事件$off方法

1、beforeCreate（创建前）
2、created（创建后）
3、beforeMount（挂载前）
4、mounted（挂载后）
5、beforeUpdate（更新前）
6、updated（更新后）
7、beforeDestory（销毁前）
8、destoryed（销毁后）

2.v-if和v-show的区别
v-if会根据判断条件来动态增删dom元素，v-show是根据判断条件来进行显示和隐藏元素频繁的进行增删dom操作会影响页面加载速度和性能
项目程序不大的时候都可以 v-if 影响不大
项目程序大的时候不推荐使用v-if来进行判断展示和隐藏，推荐使用v-show

3.vuex
state是放置所有公共状态的属性
mutations修改state的方法 同步 参数 state和payload
actions 异步方法修改数据 参数context 相当于this.$store  store的运行实例
getters所有vuex的计算属性

4.状态码
200 请求已成功，
201 请求成功，服务器正在创建请求的资源
401 请求需要请求者验证
403 服务器拒绝该请求
404 找不到请求网页
500 服务器代码报错

5.mvvm
View 是视图层，也就是用户界面。前端主要由 HTML 和 CSS 来构建 。
Model 是指数据模型，泛指后端进行的各种业务逻辑处理和数据操控，对于前端来说就是后端提供的 api 接口。
ViewModel 是由前端开发人员组织生成和维护的视图数据层。

父子组件传值  
父传子
  在父组件中引用子组件，
  在父组件中的子组件标签里通过冒号绑定父组件中的值，
  在子组件中通过props接收
子传父
  this.$emit('自定义事件名', this.message); 
  在父组件的子组件标签上 通过@自定义事件 获取到子组件传过来的值

JS数组方法
jois()  数组转字符串，括号里面写字符串  ("要加引号"),
push():  把里面的内容添加到数组末尾，并返回修改后的长度。
pop()：移除数组最后一项，返回移除的那个值，减少数组的length。
shift()：删除原数组第一项，并返回删除元素的值；如果数组为空则返回undefined 。 
unshift:将参数添加到原数组开头，并返回数组的长度 。
sort()：将数组里的项从小到大排序
reverse()：反转数组项的顺序。
concat() ：将参数添加到原数组中。这个方法会先创建当前数组一个副本，
然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。
slice()：返回从原数组中指定开始下标到结束下标之间的项组成的新数组。
有负数是加上原数组长度
splice()：删除、插入和替换。
indexOf()：接收两个参数：要查找的项和（可选的）表示查找起点位置的索引。其中， 从数组的开头（位置 0）开始向后查找。
lastIndexOf：接收两个参数：要查找的项和（可选的）表示查找起点位置的索引。其中， 从数组的末尾开始向前查找。 
forEach()   map()  
filter()：“过滤”功能，数组中的每一项运行给定函数，返回满足过滤条件组成的数组。

es6新增特性
const  let  关键字  没有变量的提升，有块级作用域
数组结构赋值  对象结构赋值
箭头函数
扩展运算符
Array.from()   把伪数组转成数组
find()方法和findIndex()方法  
find()：用于查找数组中的值
findIndex()：用于查找数组的下标，用法与find一样
includes()方法  判断数组是否包含某个值，返回 true / false
新增对象Set  Set的特点就是该对象里面的成员不会有重复。