## 第一天复习
近几年前端东西发展的十分迅速,面试题也是包罗万象,实话说用起来可能公司用不到,但是面试就是会问到。
我决定从几个方面入手,一个是框架(vue),一个是JS,上传代码工具git,每天Get一点,加油!
由于之前做的项目vue为主,就复习vue框架。
Vue框架(面试题比较常见的)
1、vue的双向绑定数据原理
vue实现数据双向绑定主要是:采用数据劫持结合“发布者 - 订阅者”模式的方式,通过Object.defineProperty()来劫持各个属性的setter、getter,在数据变动时发布消息给订阅者,触发相应监听回调。
2、解释单向数据流和双向数据绑定
单向数据流:数据流是单向的。数据流方向可以跟踪,流动单一,追查问题可以更快。缺点写起来不方便,要使ui发生变更就必须创建各种action来维护对应的state.
双向数据流绑定:数据之间是相通的,将数据变更的操作隐藏在框架内部。优点是在交互较多的场景下,会简化大量与业务无关的代码。缺点就是无法追踪局部状态的变化,增加了出错时debug的难度。
3、vue如何去除url中的“#”
vue-router默认使用的hash模式,所以在路由加载的时候,项目中的url会自带“#”,可以使用vue-router的另一种模式history需要注意的是,当我们启用history模式的时候,由于我们的项目是一个单页面应用,所以在路由跳转的时候,就会出现访问不到静态资源而出现“404”的情况,这时候就需要服务端增加一个覆盖所有情况的候选资源:如果URL匹配不到任何静态资源,则应该返回同一个“index.html”页面。
4、对MVC、MVVM的理解MUC特点:
1.View传送指令到Controller
2.Controller完成业务逻辑后,要求Model改变状态;
3.Model将新的数据发送到View,用户得到反馈所有通信都是单向的。
MVVM特点:
1.各部分之间的通信,都是双向的;
2.采用双向绑定:view的变动,自动反映在ViewModel,反之亦然。
5、Vue生命周期的理解
生命周期一个实例从开始创建到销毁的这个过程。
beforeCreated():在实例创建之间执行,数据未加载状态。
created():在实例创建、数据加载后,能初始化数据,Dom渲染之前执行。
beforeMount():虚拟Dom已创立完成,在数据渲染前最后一次更改数据。
Mounted():页面、数据渲染完成,真实Dom挂载完成。
beforeUpadate():重新渲染完成,真实Dom挂载完成。
updated():数据已经更新完成,Dom也重新render完成,更改数据会陷入死循环。beforeDestory()销毁前
destoryed()销毁后
6、组件通信父组件向子组件通信
子组件通过props属性,绑定父组件数据,实现双方通信。
子组件向父组件通信将父组件的事件在子组件中通过$emit触发
非父子组件、兄弟组件之间的数据传递$eventBus
7、vue-router 路由实现路由
就是用来跟后端服务器进行交互的一种方式,通过不同的路径,来请求不同的资源,请求不同的页面是路由的其中一种功能。
8、v-if 和 v-show 区别使用
v-if的时候,如果值为false,那么页面将不会有这个html标签生成。v-show则是不管值为true还是false,html元素都会存在,只是css中的display显示或隐藏。
9、$route 和 $router的区别
r
o
u
t
e
r
为
V
u
e
R
o
u
t
e
r
实
例
,
想
要
导
航
到
不
同
U
R
L
,
则
使
用
router 为 VueRouter实例,想要导航到不同URL,则使用
router为VueRouter实例,想要导航到不同URL,则使用router.push方法。
$route为当前router跳转对象里面可以获取name、path、query、params等。
10、NextTick是做什么的
n e x t T i c k 是 在 下 次 D O M 更 新 循 环 结 束 之 后 执 行 延 迟 回 调 , 在 修 改 数 据 之 后 使 用 nextTick是在下次DOM更新循环结束之后执行延迟回调,在修改数据之后使用 nextTick是在下次DOM更新循环结束之后执行延迟回调,在修改数据之后使用nextTick,则可以在回调中获取更新后的Dom
11、vue组件data为什么必须是函数
因为JS本身的特性带来的,如果data是一个对象,那么由于对象本身属于引用类型,当我们修改其中一个属性时,会影响到所有vue实例的数据。如果data作为一个函数返回一个对象,那么每一个实例的data属性都是独立的,不会相互影响了。
12、计算属性computed 和事件methods 有什么区别
我们可以将同一个函数定义为一个method或者一个计算属性。对于最终的结果,两种方式是相同的。
不同点:computed:计算属性是基于它们依赖进行缓存的,只有在它的相关依赖发生改变时都会重新求值。
mehod:只要发生重新渲染,method调用总会执行该函数。
13、对比JQ与vue有什么不同?
jQ专注视图层,操作Dom实现页面逻辑渲染VUE专注数据层,通过数据的双向绑定,最终显示在页面。vue使用组件化思想,提高开发效率,重复率高。
14、对keep-alive
keep-alive是vue内置的一个组件可以使被包含的组件保留状态,或避免重新渲染。
15、vue中key的作用
key的特殊属性主要用在vue的虚拟Dom算法,在新旧nodes对比时辨别VNodes。如果不使用key,vue会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用key,它会基于key的变化重新排列元素顺序,并且会移除key不存在的元素。有相同父元素的子元素必须有独特的key.重复的key会造成渲染错误。
16、vue $nextTick
1.修改data数据后,数据不是实时更新的。
2.当你需要在数据更新dom后执行某个操作,该操作需要放在nextTick中。
JS
今天先看几道js的笔试面试题