vue面试常被问到的问题整理

1、Vue的双向数据绑定原理是什么?

答 : vue是采用数据劫持,并且使用发布-订阅者的开发模式。原理是观察者observer通过Object.defineProperty()来劫持到各个属性的getter setter,在数据变动的时候,会被observer观察到,会通过Dep通知数据的订阅者watcher,之后进行相应的视图上面的变化

具体实现步骤,感兴趣的可以看看

第一步:需要observe的数据对象进行递归遍历,包括子属性对象的属性,都加上 setter和getter 
这样的话,给这个对象的某个值赋值,就会触发setter,那么就能监听到了数据变化

第二步:compile解析模板指令,将模板中的变量替换成数据,然后初始化渲染页面视图,并将每个指令对应的节点绑定更新函数,添加监听数据的订阅者,一旦数据有变动,收到通知,更新视图

第三步:Watcher订阅者是Observer和Compile之间通信的桥梁,主要做的事情是: 
1、在自身实例化时往属性订阅器(dep)里面添加自己 
2、自身必须有一个update()方法 
3、待属性变动dep.notice()通知时,能调用自身的update()方法,并触发Compile中绑定的回调,则功成身退。

第四步:MVVM作为数据绑定的入口,整合Observer、Compile和Watcher三者,通过Observer来监听自己的model数据变化,通过Compile来解析编译模板指令,最终利用Watcher搭起Observer和Compile之间的通信桥梁,达到数据变化 -> 视图更新;视图交互变化(input) -> 数据model变更的双向绑定效果

2、请详细说下你对vue生命周期的理解?

答 : 创建前/后,DOM渲染前/后,更新前/后,销毁前/后; 
对于各个周期的理解: 
创建前/后: 
beforeCreated:此时的vue实例还没有挂载元素$el,数据对象data也是undefiend; 
created:vue实例的数据对象data有了,但是$el还没有 
载入前/后: 
beforeMount:vue的实例的$el和data都初始化了,但还是挂载在之前虚拟的DOM节点上面,data.message还未替换 
mounted :vue实例挂载完成,data.message成功渲染。 
更新前/后 
在data发生变化的时候,会触发beforeUpdate和updated方法。 
销毁前/后: 
在destiory之后,对data的改变不会再触发周期函数,说明此时vue实例已经解除了事件监听以及和dom的绑定,但是dom结构依然存在

3.请说下封装 vue 组件的过程?

首先,组件可以提升整个项目的开发效率。能够把页面抽象成多个相对独立的模块,解决了我们传统项目开发:效率低、难维护、复用性等问题。 
然后,使用Vue.extend方法创建一个组件,然后使用Vue.component方法注册组件。子组件需要数据,可以在props中接受定义。而子组件修改好数据后,想把数据传递给父组件。可以采用emit方法。

4、active-class是哪个组件的属性?

vue-router模块的router-link组件。

5、嵌套路由怎么定义?

当有多层组件嵌套的时候,可以考虑嵌套路由实现 
因此我们需要在 VueRouter 的参数中使用 children 配置,这样就可以很好的实现路由嵌套。 
可能还会问如何实现重定向: 
使用redirect配置

6.怎么定义vue-router的动态路由?怎么获取传过来的动态参数?

在router目录下的index.js文件中,对path属性加上/:id。 
使用router对象的params.id。

7.vue-router有哪几种导航钩子?

三种; 
最常用的是一个全局导航钩子,router.beforeEach(to,from,next),可以用作路由跳转前进行判断拦截 
第二种:组件内的钩子 
第三种:单独路由独享组件

8、scss是什么?在vue.cli中的安装使用步骤是?有哪几大特性?

css的预编译。 
使用步骤: 
第一步:用npm 下三个loader(sass-loader、css-loader、node-sass) 
第二步:在build目录找到webpack.base.config.js,在那个extends属性中加一个拓展.scss 
第三步:还是在同一个文件,配置一个module属性 
第四步:然后在组件的style标签加上lang属性 ,例如:lang=”scss”

9、v-model是什么?怎么使用? vue中标签怎么绑定事件?

可以实现双向绑定,指令(v-class、v-for、v-if、v-show、v-on)。vue的model层的data属性。绑定事件:

10、axios是什么?怎么使用?怎么解决跨域的问题

axios:是请求后台资源的模块; 
因为vue-cli会建立一个服务器,那么本地去用axios请求,会造成跨域;解决方法是通过vue-cli生成的框架的结构目录下的config/index.js,去配置proxyTable配置项; 
详情可参照:https://blog.csdn.net/qq_33559304/article/details/72966028

11.vuex是什么?怎么使用?哪种功能场景使用它?

vue框架中状态管理。在main.js引入store,注入。新建了一个目录store,….. export 。场景有:单页应用中,组件之间的状态。音乐播放、登录状态、加入购物车

12.vuex的store有几个属性值?

state、mutations、actions、getters四个属性值

原文地址:https://www.cnblogs.com/qdjl/p/9363206.html

时间: 2024-08-30 16:58:14

vue面试常被问到的问题整理的相关文章

Java面试常被问到这道题:如何保证缓存与数据库的双写一致性?

面试原题 如何保证缓存与数据库的双写一致性? 面试官心理分析 你只要用缓存,就可能会涉及到缓存与数据库双存储双写,你只要是双写,就一定会有数据一致性的问题,那么你如何解决一致性问题? 面试题剖析 一般来说,如果允许缓存可以稍微的跟数据库偶尔有不一致的情况,也就是说如果你的系统不是严格要求?"缓存+数据库" 必须保持一致性的话,最好不要做这个方案,即:读请求和写请求串行化,串到一个内存队列里去. 串行化可以保证一定不会出现不一致的情况,但是它也会导致系统的吞吐量大幅度降低,用比正常情况下

面试常问问题:银行网上支付项目中怎么控制多线程高并发访问?

面试常问问题:银行网上支付项目中怎么控制多线程高并发访问? synchronized关键字主要解决多线程共享数据同步问题. ThreadLocal使用场合主要解决多线程中数据因并发产生不一致问题. ThreadLocal和Synchonized都用于解决多线程并发访问.但是ThreadLocal与synchronized有本质的区别: synchronized是利用锁的机制,使变量或代码块在某一时该只能被一个线程访问.而ThreadLocal为每一个线程都提供了变量的副本,使 得每个线程在某一时

java面试常问的几个问题

1,作用域public,protected,private,以及不写时的区别 2,ArrayList和Vector的区别,HashMap和Hashtable的区别 3,char型变量能不能定义为一个中文?为什么? 4,多线程有几种表示方法,都是什么?同步有几种实现方法,都是什么? 5,继承时候类的执行顺序问题,一般都是选择题,问你将会打印出什么? 6,内部类的实现方式? 7,垃圾回收机制,如何优化程序? 8,float型float f=3.4是否正确? Jsp方面 1,jsp有哪些内置对象?作用

计算机考研复试面试常问问题 计算机网络篇(下)

计算机考研复试面试常问问题 计算机网络篇(下) 在复习过程中,我用心查阅并整理了在考研复试面试中可能问到的大部分问题,并分点整理了答案,可以直接理解背诵并加上自己的语言润色!极力推荐打印下来看,效率更高!绝对良心之作! 此系列一共有8篇:编程语言篇|数据结构篇|操作系统篇|组成原理篇|计算机网络篇|数据库篇|软件工程篇|计算机专业英语篇(还未全部完成,敬请期待,你们的支持和关注是我最大的动力!) 个人整理,不可用于商业用途,转载请注明出处. 作者各个平台请搜索:程序员宝藏.快来探索属于你的宝藏吧

计算机考研复试面试常问问题 操作系统篇

计算机考研复试面试常问问题 操作系统篇 在复习过程中,我用心查阅并整理了在考研复试面试中可能问到的大部分问题,并分点整理了答案,可以直接理解背诵并加上自己的语言润色!极力推荐打印下来看,效率更高! 此系列一共有8篇:编程语言篇|数据结构篇|操作系统篇|组成原理篇|计算机网络篇|数据库篇|软件工程篇|计算机专业英语篇(还未全部完成,敬请期待,你们的支持和关注是我最大的动力!) 个人整理,不可用于商业用途,转载请注明出处. 作者各个平台请搜索:程序员宝藏.快来探索属于你的宝藏吧! 需要pdf直接打印

计算机考研复试面试常问问题 组成原理篇(下)

计算机考研复试面试常问问题 组成原理篇(下) 使用前需知(拒绝白嫖,从你我做起,你只需点个赞就行): 需要pdf直接打印版,可在公众号"程序员宝藏"回复复试上岸获取(会持续更新) 在复习过程中,我用心查阅并整理了在考研复试面试中可能问到的大部分问题,并分点整理了答案,可以直接理解背诵并加上自己的语言润色!极力推荐打印下来看,效率更高! 声明:一些边边角角的没有收集,毕竟是考研面试,不是笔试,这样也能减轻大家的负担! 有些点在(快速唤起记忆知识框架)里就有,所以没有加上! 此系列一共有8

10个Python面试常问的问题

概述 Python是个非常受欢迎的编程语言,随着近些年机器学习.云计算等技术的发展,Python的职位需求越来越高.下面我收集了10个Python面试官经常问的问题,供大家参考学习. 类继承 有如下的一段代码: class A(object): def show(self): print 'base show' class B(A): def show(self): print 'derived show' obj = B() obj.show() 如何调用类A的show方法了. 方法如下: o

Android异步消息传递机制源码分析&&相关知识常被问的面试题

1.Android异步消息传递机制有以下两个方式:(异步消息传递来解决线程通信问题) handler 和 AsyncTask 2.handler官方解释的用途: 1).定时任务:通过handler.postDelay(Runnable r, time)来在指定时间执行msg. 2).线程间通信:在执行较为耗时操作的时候,在子线程中执行耗时任务,然后handler(主线程的)把执行的结果通过sendmessage的方式发送给UI线程去执行用于更新UI. 3.handler源码分析 一.在Activ

vue 面试时需要准备的知识点

前端火热的框架层出不穷,作为码农的我们,依旧需要去学习,去探索新的问题,学习新技术,其实就是为了写一手好的,自认为是高质量的代码.今天主要分享一下前端最火的框架vue,也是我比较喜欢的框架. vue上手可以说是比较轻松而且简单,如果你用过angular,react,你也会很喜欢vue.vue的核心思想依旧是:构建用户界面的渐进式框架,关注视图的变化.这也是为什么新建的文件是结构是template script style vue的使用由很多种,可以直接引入vue.js就可以开启vue的开发.但是