前端面试题 X 10

128 阅读3分钟

1.为什么虚拟DOM会提高性能

虚拟dom相当于在js和真实dom中间加了一个缓存,利用dom diff算法避免了没有必要的dom操作,从而提高性能。

2.vue3跟vue2的不同之处

(1)composition API:组合API使开发者可以灵活的组织和复用组件逻辑,Vue3引入了一个新的配置,叫做setup函数,在这个函数中可以使用ref、reactive、composition等Composition API来处理状态和逻辑。

(2)响应式系统:Vue3使用Proxy替代Vue2中的Object.defineProperty使得响应式系统更加强大和高效。

(3)插槽:Vue3中的插槽API得到了改善,可以使用v-slots来指定内容。

(4)生命周期钩子函数:Vue3中的生命周期钩子被重新命名并分类到onBeforeMount、onMounted等,且引入了新的生命周期钩子,如onRenderTracked和onRenderTriggerd。

(5)teleport & suspense:Vue3引入了两个新的内置组件:和,分别用于实现页面内的端口传送和组件的异步加载。

3.箭头函数与普通函数的区别

箭头函数比普通函数简介。

箭头函数没有自己的this,而是使用上层函数的this,也不能改变该this。

箭头函数不能作为构造函数。

箭头函数没有自己的prototype。

箭头函数没有自己的arguments。

4.Cookie、LocalStorage、SessionStorage区别

数据存放有效期:

Cookie:在设置的过期日期前有效,即使关闭浏览器窗口。

SessionStorage:关闭浏览器/窗口/标签时销毁。

LocalStorage:始终有效,及时关闭浏览器,所以叫持久化储存。

设置过期时间:

Cookie:可设置过期时间。 SessionStorage/LocalStorage:不可设置。

储存空间:

Cookie:不超过4K。

SessionStorage/LocalStorage:不超过5M。

作用域:

Cookie、LocalStorage:同源窗口数据可共享。

sessionStorage:不同浏览器窗口间数据不共享,即使同源。

5.HTTP状态码有哪些?

1xx:信息状态码:表示接收的请求正在处理。

2xx:成功状态码:表示请求正常处理完毕。

3xx:重定向状态码:需要额外操作以完成请求处理。

4xx:客户端错误状态码:表示客户端错误。

5xx:服务器错误状态码:表示服务器错误。

200:请求成功。

301:请求的资源已永久移到新位置。

404:服务器无法找到请求的数据。

500:服务器遇到了阻止它完成请求的情况。

6.什么是diff算法?

diff算法是一种对比算法。首先将旧虚拟DOM和新虚拟DOM进行对比,找出已更改的虚拟节点并只更新这些虚拟节点所对应的真实节点,而不用更新其他没发生数据改变的节点,实现精准地更新真实DOM,进而提高效率。

7.Vuex的5个核心属性是什么?

分别是state、getters、mutations、actions、modules。

8.什么是原型?

每个函数都有一个prototype属性,这个属性会指向通过调用该构造函数而创建的实例的原型,可以通过实例对象的-proto-来访问到这个原型对象。

9.await的作用

await放在一个promise对象前,然后以返回值的形式等待并拿到promise异步结果,使异步结果更简单方便的获取,避免了回调的嵌套结构,省略了then函数调用。

10.http有哪些请求方式?

get(查询)、post(增加)、put(修改)、delete(删除)、patch(局部修改)、head(与get类似,但服务器只返回首部,不返回实体主体,它常用于获取资源的元信息而不需要获取实际内容)。