王尘宇王尘宇

研究百度干SEO做推广变成一个被互联网搞的人

vue前端面试题知识点整理

特点:

1.View 传送指令到 Controller
2.Controller 完成业务逻辑后,要求 Model 改变状态
3.Model 将新的数据发送到 View,用户得到反馈

MVVM

所有通信都是单向的
特点:

1.各部分之间的通信,都是双向的
2.采用双向绑定:View 的变动,自动反映在 ViewModel,反之亦然
具体请移步 这里

5. 介绍虚拟DOM

参考这里

6. vue生命周期的理解

vue实例有一个完整的生命周期,生命周期也就是指一个实例从开始创建到销毁的这个过程
1.beforeCreated() 在实例创建之间执行,数据未加载状态
2.created() 在实例创建、数据加载后,能初始化数据,dom渲染之前执行
3.beforeMount() 虚拟dom已创建完成,在数据渲染前最后一次更改数据
4.mounted() 页面、数据渲染完成,真实dom挂载完成
5.beforeUpadate() 重新渲染之前触发
6.updated() 数据已经更改完成,dom 也重新 render 完成,更改数据会陷入死循环
7.beforeDestory() 和 destoryed() 前者是销毁前执行(实例仍然完全可用),后者则是销毁后执行

7. 组件通信

父组件向子组件通信
子组件通过 props 属性,绑定父组件数据,实现双方通信

子组件向父组件通信
将父组件的事件在子组件中通过 $emit 触发

非父子组件、兄弟组件之间的数据传递

8. vue-router 路由实现

路由就是用来跟后端服务器进行交互的一种方式,通过不同的路径,来请求不同的资源,请求不同的页面是路由的其中一种功能

9. v-if 和 v-show 区别

使用了 v-if 的时候,如果值为 false ,那么页面将不会有这个 html 标签生成。
v-show 则是不管值为 true 还是 false ,html 元素都会存在,只是 CSS 中的 display 显示或隐藏

10. router的区别

router.push 方法
$route 为当前 router 跳转对象里面可以获取 name 、 path 、 query 、 params 等

11. NextTick 是做什么的

nextTick,则可以在回调中获取更新后的 DOM
具体可参考官方文档 深入响应式原理

12. Vue 组件 data 为什么必须是函数

因为js本身的特性带来的,如果 data 是一个对象,那么由于对象本身属于引用类型,当我们修改其中的一个属性时,会影响到所有Vue实例的数据。如果将 data 作为一个函数返回一个对象,那么每一个实例的 data 属性都是独立的,不会相互影响了

13. 计算属性computed 和事件 methods 有什么区别

我们可以将同一函数定义为一个 method 或者一个计算属性。对于最终的结果,两种方式是相同的

不同点:

computed: 计算属性是基于它们的依赖进行缓存的,只有在它的相关依赖发生改变时才会重新求值
对于 method ,只要发生重新渲染,method 调用总会执行该函数

17. 对 keep-alive 的了解

keep-aliveVue 内置的一个组件,可以使被包含的组件保留状态,或避免重新渲染

<keep-alive>
  <component>
    <!-- 该组件将被缓存! -->
  </component>
</keep-alive>

可以使用API提供的props,实现组件的动态缓存

具体参考 官方API

18. Vue 中 key 的作用

key 的特殊属性主要用在 Vue 的虚拟 DOM 算法,在新旧 nodes 对比时辨识 VNodes。如果不使用 keyVue 会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用 key,它会基于 key 的变化重新排列元素顺序,并且会移除 key 不存在的元素。

有相同父元素的子元素必须有独特的 key。重复的 key 会造成渲染错误

具体参考 官方API

相关文章

评论列表

发表评论:
验证码

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。