前端实习面试题

前端面试

1.vue生命周期，钩子函数

四个阶段，八个钩子函数

周期阶段：

1. 创建阶段 beforeCreate，created
2. 挂载阶段 beforeMount (render)，mounted
3. 更新阶段 beforeUpdate，updated
4. 销毁阶段 beforeDestory，destoryed

钩子函数：

1. beforeCreate

实例初始化后，进行数据侦听和事件/侦听器的配置之前同步调用。

无法获取数据，真实dom元素也没有渲染。

2.created

实例创建完成后立即同步调用

可以访问数据了，但是dom节点还是没有渲染出来。可以进行相关初始化事件的绑定，发送请求操作。

3.beforeMount

在挂载开始前被调用：相关的render函数首次被调用。

4.mounted

实例被挂载后调用，挂载阶段的最后一个钩子函数，数据挂载完毕，dom元素也渲染出来了。

5.beforeUpdate

当组件挂载完毕的时候，且数据改变的时候，才会立马执行，获取dom的内容是更新之前的内容。

6.updated

数据更改导致的虚拟DOM重新渲染和更新完毕之后被调用。获取dom更新之后的内容生成新的虚拟dom。

7.beforeDestory

实例销毁之前调用，善后操作，可以清除一些初始化事件，定时器相关的东西。

8.destoryed

销毁后调用，Vue实例失去活性，完全丧失功能。

2.js基本数据结构

String，Number，Boolean，Array，Object，null，undefined

3.路由，如果让你创建一个路由，你要怎么创建。

1. 安装Vue Router

2. 创建路由配置

3. 创建视图组件

4. 在主应用中使用路由

5. 挂载路由

4.computed和watch有什么不同

computed：计算属性，用于对数据进行处理和计算。它具有响应式，当依赖的数据发生改变时，计算属性会自动更新。

watch：

• watch 可以监听数据的变化，并在数据变化时执行一些自定义的逻辑，比如发送 AJAX 请求、触发动画等。
• watch 不会自动对数据进行处理或计算，而是在数据变化时执行特定的操作。

computed 适用于需要对数据进行计算或处理，并且结果具有响应性的场景；而 watch 则适用于需要在数据变化时执行一些自定义的逻辑的场景。

5.了解ES6吗；

ES6就是ECMAScript的第6个版本。

ECMAScript是JavaScript的规格，JavaScript是ECMAScript的一种实现

6.js中数组的几个方法

1. push(): 向数组末尾添加一个或多个元素，并返回新数组的长度。
2. pop(): 删除并返回数组的最后一个元素。
3. shift(): 删除并返回数组的第一个元素。
4. unshift(): 向数组的开头添加一个或多个元素，并返回新数组的长度。
5. concat(): 连接两个或多个数组，并返回一个新数组。
6. splice(): 从指定位置删除或插入元素，并可选地替换元素。
7. slice(): 返回一个新数组，其中包含从开始到结束（不包括结束）选择的元素。
8. indexOf(): 返回指定元素第一次出现在数组中的索引，如果不存在则返回 -1。
9. lastIndexOf(): 返回指定元素最后一次出现在数组中的索引，如果不存在则返回 -1。
10. includes(): 判断数组是否包含指定元素，返回 true 或 false。
11. forEach(): 遍历数组中的每个元素，并对其执行提供的函数。
12. map(): 创建一个新数组，其元素是对原始数组元素调用提供的函数的结果。
13. filter(): 创建一个新数组，其中包含通过所提供函数实现的测试的所有元素。
14. reduce(): 从左到右执行累加器函数，将数组减少为单个值。
15. reduceRight(): 从右到左执行累加器函数，将数组减少为单个值。
16. find(): 返回数组中满足提供的测试函数的第一个元素的值，否则返回 undefined。
17. findIndex(): 返回数组中满足提供的测试函数的第一个元素的索引，否则返回 -1。
18. every(): 测试数组的所有元素是否通过所提供函数的测试。
19. some(): 测试数组的某些元素是否通过所提供函数的测试。
20. sort(): 对数组元素进行排序，可选地接受一个比较函数。
21. reverse(): 颠倒数组中元素的顺序。
22. join(): 将数组的所有元素连接成一个字符串。
23. toString(): 返回数组的字符串表示形式。
24. isArray(): 判断给定值是否为数组。

7.== 和 === 有什么区别

1. ==（相等运算符）：在使用 == 进行比较时，JavaScript 会尝试在进行比较之前将两个操作数转换为相同的类型。这意味着如果两个操作数的类型不同，JavaScript 将会尝试进行类型转换，然后再进行比较。例如，1 == '1' 返回 true，因为 JavaScript 会将字符串 '1' 转换为数字 1，然后进行比较。
2. ===（严格相等运算符）：在使用 === 进行比较时，JavaScript 不会进行类型转换。它会检查操作数的值和类型是否完全相同。只有在值和类型都相同时，=== 才会返回 true。例如，1 === '1' 返回 false，因为它们的类型不同。

8.push最后的结果是什么

push() 方法用于向数组的末尾添加一个或多个元素，并返回新数组的长度。当使用 push() 方法后，数组会被修改，新元素会被添加到数组的末尾。返回值是表示添加新元素后数组的长度

9.路由中的meta是什么

meta 是一个用于存储路由元信息的对象。这些元信息可以是任何你想要关联到特定路由的数据，比如页面标题、权限要求、页面描述等等。meta 对象可以包含任意数量的属性，你可以根据自己的需求来定义。

在使用路由器（比如 Vue Router）时，你可以在定义路由规则时通过 meta 字段来添加这些元信息。然后在应用程序的其他地方（比如页面组件）可以通过路由对象来访问这些信息。

10.请求响应拦截器用的什么方法

在 axios 中，可以使用 interceptors 属性来添加请求和响应拦截器。请求拦截器用于在请求发送前对请求进行处理，而响应拦截器用于在接收到响应后对响应进行处理。