2020前端面试题和笔试题——Vue

面试 vue前端工程师的常见面试题及笔试题。

面试了近十几家公司总结出一套VUE面试题，希望能帮助到更多的人。

1. 对 MVVM 的理解

   MVVM分为Model、View、ViewModel三者。
   Model：代表数据模型
   View：代表视图
   ViewModel：连接视图和模型，实现数据的双向绑定

2. Vue 实现数据双向绑定的原理

   采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。当把一个普通的 JavaScript 对象传给 Vue 作为它的 data 选项时，Vue 将遍历它的属性，用 Object.defineProperty 将它们转化为 getter/setter，用户看不到getter/setter，但是在内部它们让 Vue 追踪依赖，在属性被访问和修改时通知变化。
   1、实现一个数据监听器Observer，能够对数据对象的所有属性进行监听，如有变动可拿到最新值并通知订阅者
   2、实现一个指令解析器Compile，对每个元素节点的指令进行扫描和解析，根据指令模板替换数据，以及绑定相应的更新函数
   3、实现一个Watcher，作为连接Observer和Compile的桥梁，能够订阅并收到每个属性变动的通知，执行指令绑定的相应回调函数，从而更新视图

3. 对 webpack 的了解

   前端打包工具…

4. 对前端工程化的理解

5. 对模块化，组件化的理解

6. 使用 vue-lic 搭建一个 Vue 的项目

7. 对 npm 的了解

   第三方库的管理工具

8. ES6 提出了哪些新概念

9. HTTP 常见的状态码

10. 数组的常用方法，及使用

11. let 和 var 的区别

12. 跨域问题 如何解决

    jsonp

13. 如何解决浏览器的兼容问题

14. 对于 数据安全 的措施

    md5，对称加密，非对称加密

15. Vue 全家桶——vue，vue-router，vuex

16. vuex 的五个核心属性

    state，getter，mutations，actions，modules

17. v-show 和 v-if 的区别

18. 父子组件的传值

19. 路由跳转的方式

    1. router-link
    2. router.push('/home')

20. Vue 实例的生命周期

21. vue-router 中 hash 模式和 history 模式的区别

    最直观的区别是在 url 中 hash 带了一个 # 而 history 是没有的；
    history 需要后端提供支持；
    history 跳转后刷新或者回跳会报错

22. 对 ui 框架的使用

    element-ui，iview，ionic

23. angular 和 vue 的对比

24. 原生 Ajax 如何发送请求

25. 闭包的概念

    函数嵌套函数，内部函数引用外部函数变量，外部函数调用之后，其对象本该被销毁，但闭包的存在，使我们仍然可访问外部函数的变量对象，导致垃圾回收机制没有生效，变量被保存下来，内存泄漏。

26. Vue 中发送请求的方式

    vue-router

27. axios 怎样发送请求

28. 前端缓存

    cookie, WebStorage

29. CSS 常用的布局

30. 你用过的 CSS 框架

    less

31. 对单向数据流的理解

32. 计算属性（computed）和 watch 的区别

33. 回调函数

34. Promise 三种状态

35. 同步和异步的概念

36. Get 请求和 Post 请求的区别

37. 自定义过滤器

以下是笔试题