vuejs前端开发实战课后习题答案解析.docx
vuejs前端开发实战课后习题答案Vue.js是一套构建用户界面的渐进式框架，学习起来非常简单，在前端编程时经常会用到vue框架，在我们找工作时所遇到的面试题中也会有许多vue相关的问题，本文为大家提供了一些VUe的面试题希望对大家有一定的帮助。1 .说一下VUe的双向绑定数据的原理vue实现数据双向绑定主要是：采用数据劫持结合"发布者订阅者模式的方式，通过ObjectdefinePropertyO来劫持各个属性的settergetter,在数据变动时发布消息给订阅者，触发相应监听回调。2 .解释单向数据流和双向数据绑定单向数据流：顾名思义，数据流是单向的。数据流动方向可以跟踪，流动单一，追查问题的时候可以更快捷。缺点就是写起来不太方便。要使Ul发生变更就必须创建各种action来维护对应的stateo双向数据绑定：数据之间是相通的，将数据变更的操作隐藏在框架内部。优点是在表单交互较多的场景下，会简化大量与业务无关的代码。缺点就是无法追踪局部状态的变化，增加了出错时debug的难度。3 .Vue如何去除URL中的vue-router默认使用hash模式，所以在路由加载的时候，项目中的URL会自带如果不想使用“#，可以使用vue-router的另一种模式history：需要注意的是，当我们启用history模式的时候，由于我们的项目是一个单页面应用，所以在路由跳转的时候，就会出现访问不到静态资源而出现“404的情况。这时候就需要服务端增加一个覆盖所有情况的候选资源：如果URL匹配不到任何静态资源，则应该返回同一个"index.html”页面。4 .对MVCMVVM的理解MVC特点：1、View传送指令到Controller；2、Controller完成业务逻辑后，要求Model改变状态；3、Model将新的数据发送到View,用户得到反馈。所有通信都是单向的。MVVM特点：1、各部分之间的通信，都是双向的；2、采用双向绑定：VieW的变动，自动反映在ViewModeL反之亦然。5 .Vue生命周期的理解Vue实例有一个完整的生命周期，生命周期也就是指一个实例从开始创建到销毁的这个过程。1、beforeCreated():在实例创建之间执行，数据未加载状态。2、created()：在实例创建、数据加载后，能初始化数据，DOM渲染之前执行。3、beforeMount():虚拟DOM已创建完成，在数据渲染前最后一次更改数据。4、mounted():页面、数据渲染完成，真实DOM挂载完成。5、beforepadate():重新渲染之前触发。6、updated():数据已经更改完成，DOM也重新render完成，更改数据会陷入死循环。7>beforeDestory()destoryed():前者是销毁前执行(实例仍然完全可用)，后者则是销毁后执行。6. 组件通信父组件向子组件通信子组件通过props属性，绑定父组件数据，实现双方通信。子组件向父组件通信将父组件的事件在子组件中通过$emit触发。非父子组件、兄弟组件之间的数据传递7. vue-router路由实现路由就是用来跟后端服务器进行交互的一种方式，通过不同的路径，来请求不同的资源，请求不同的页面是路由的其中一种功能。8. v-if和v-show区别使用v-if的时候，如果值为false,那么页面将不会有这个html标签生成。v-show则是不管值为true还是false,html元素都会存在，只是CSS中的display显示或隐藏。9. $route和$router的区别Srouter为VueRouter实例，想要导航到不同URL,则使用$router.push方法。$route为当前router跳转对象里面可以获取name、path、query、params等。10. NextTick是做什么的SnextTick是在下次DOM更新循环结束之后执行延迟回调，在修改数据之后使用SnextTick,则可以在回调中获取更新后的DOMo11. Vue组件data为什么必须是函数因为JS本身的特性带来的，如果data是一个对象，那么由于对象本身属于引用类型，当我们修改其中的一个属性时，会影响到所有Vue实例的数据。如果将data作为一个函数返回一个对象，那么每一个实例的data属性都是独立的，不会相互影响了。12. 计算属性computed和事件methods有什么区别我们可以将同一函数定义为一个method或者一个计算属性。对于最终的结果，两种方式是相同的。不同点：1、computed：计算属性是基于它们的依赖进行缓存的，只有在它的相关依赖发生改变时才会重新求值。2、method：只要发生重新演染，method调用总会执行该函数。13. 对比jQuery,Vue有什么不同jQuery专注视图层，通过操作DOM去实现页面的一些逻辑渲染；Vue专注于数据层，通过数据的双向绑定，最终表现在DOM层面，减少了DOM操作。Vue使用了组件化思想，使得项目子集职责清晰，提高了开发效率，方便重复利用，便于协同开发。14. Vue中怎么自定义指令全局注册局部注册15. Vue中怎么自定义过滤器可以用全局方法Vue.filter()注册一个自定义过滤器，它接收两个参数：过滤器ID和过滤器函数。过滤器函数以值为参数，返回转换后的值。过滤器也同样接受全局注册和局部注册。16. 对keep-alive的了解keep-alive是Vue内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。可以使用API提供的props,实现组件的动态缓存。17. Vue中key的作用key的特殊属性主要用在Vue的虚拟DOM算法，在新旧nodes对比时辨识VNodeso如果不使用key,Vue会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用key,它会基于key的变化重新排列元素顺序，并且会移除key不存在的元素。有相同父元素的子元素必须有独特的keyo重复的key会造成渲染错误。18. Vue的核心是什么数据驱动、组件系统。19. Vue等单页面应用的优缺点优点1、良好的交互体验2、良好的前后端工作分离模式3、减轻服务器压力缺点1、SEO难度较高2、前进、后退管理3、初次加载耗时多
