1、vue生命周期:
beforeCreate->Created->beforeMounte->Mounted->beforeUpdate->Updated->befareDestory->Destored
2、父子组件传值:
on、props、enentBus(事件总线)、vuex、listeners
3、普通函数和箭头函数的区别:
箭头函数没有原型 原型是undefined
箭头函数this指向全局对象 而函数指向引用对象
call、apply、bind方法改变不了箭头函数的指向
4、数组扁平化:
es6: flat()
5、反转字符串:
[..."hello world"].reduce((a, v) => v+a) //reduce实现
[..."hello world"].reverse().join('') //reverse实现
6、jq和vue的区别:
vue是数据驱动,jq是控制dom元素
vue渲染优雅,代码易维护
7、vue双向绑定数据原理
Object.defineProperty()
vue是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter和、getter,在数据变动时发布消息给订阅者,触发响应的监听回调
8、基本数据类型、引用类型、基本类型的区别
数据类型:string、null、undefined、number、Boolean、symbol、bigint 、object(引用数据类型)
9、async/await和promise
使用async函数可以让代码简洁很多,不需要像promise一样使用then,不需要写匿名函数处理promise的resolve的值,也不需要定义多余的data变量,还避免了嵌套代码
async/await 让try/catch可以同时处理同步和异步的错误
10、事件捕获和事件冒泡
11、nextTick、diff、虚拟dom、watch原理
12、vuex
state、getters、mutations、actions、modules
13、es6 解构为什么出现 解决了什么问题
数据取值赋值、获取对象属性值、代码更简洁
13、v-if和v-show的区别
同时使用的话会先遍历再处理渲染
14、vue-for key的作用
diff算法的对比标识、加快diff
15、nextTick
在下次DOM更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的DOM
’
Vue生命周期的created()钩子函数进行的DOM操作一定要放在Vue.nextTick()的回调函数中
16、axios拦截器
请求拦截器(interceptors.request)、响应拦截器(interceptors.response)
api执行顺序:请求拦截器->api请求->响应拦截器
17、keep alive
用户在某个列表页面选择筛选条件过滤出一份数据列表,由列表页面进入数据详情页面,再返回该列表页面,我们希望:列表页面可以保留用户的筛选(或选中)状态。keep-alive就是用来解决这种场景。当然keep-alive不仅仅是能够保存页面/组件的状态这么简单,它还可以避免组件反复创建和渲染,有效提升系统性能。 总的来说,keep-alive用于保存组件的渲染状态。
18、强制缓存和协商缓存
强缓存不需要向服务器发送请求
协商缓存需要发送一个get请求304
19、性能优化
白屏加载使用骨架屏
减少http请求
静态资源使用CDN
CSS放在文件头部,Javascript文件放在底部
使用字体图标iconfont代替图片图标
多用缓存,不重复加载相同的资源
使用事件委托
布局使用flex弹性布局
20、路由导航守卫
router.beforeEach(全局前置守卫)、router.beforeResolve(全局解析守卫)、router.afterEach(全局后置钩子)