刷题3-VUE

vue

• 单页应用的优缺点
  单页应用：只有一个web页面作为入口，在浏览器运行期间不会重新加载页面，即浏览器一开始会加载它必需的html、css和js，之后的交互操作都在一个页面完成。由js动态加载合适的内容响应客户的操作，因此一个web页面会包含大量的js代码，支持单个页面上与多个组件进行交互

优点：
1、具有桌面应用的即时性、网站的可移植性和可访问性。
2、单页应用的内容的改变不需要重新加载整个页面
3、单页应用没有页面之间的切换，就不会出现“白屏现象”,也不会出现假死并有“闪烁”现象。
4、服务器只用出数据就可以，**不用管展示逻辑和页面合成，吞吐能力会提高几倍。
5、前后端分离，后端不再负责渲染，输出页面，后端API通用化

缺点：
1）首次加载耗时长
2）SEO问题
3）css命名冲突
4）不能使用浏览器前进、后退、地址栏和书签等

• computed 和 watch 的区别
  conputed是计算属性，methods是方法，都可以实现对data中的数据加工后再输出
  参考链接

• v-for 和 v-if 的区别
  参考博客

• 双向绑定的原理 参考博客

• 哪些操作不会触发视图更新 参考博客

• Vue3使用了proxy来代替传统的双向绑定参考博客

vue数据双向绑定原理
vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的

   var vue = new Vue({
            data: {
                obj: {
                    name: 'jack',
                    age: 12
                }
            },
            created: function() {
                console.log(this.obj)
            }
        })

age和name属性有两个对应的set和get方法?vue通过Object.defineProperty()来实现数据劫持

实现mvvm主要包含两个方面，数据变化更新视图，视图变化更新数据

view通过事件监听更新data；
data更新view：通过Object.defineProperty( )对属性设置一个set函数

实现过程

参考博客

• 组件通信的方法
  父传子：props 子传父：$emit
  参考1
  参考2

• Vuex
  vuex是专门为vue.js应用程序开发的状态管理模式，每一个vuex应用的核心就是store
  store：仓库，包含应用中大部分的state
  官当文档

• nextTick
  vue.nextTick():用于延迟执行一段代码，两个参数（回调函数，执行回调函数的上下文环境），如果没有回调函数，返回promise对象
  简书
  JS运行机制、Eventloop

• vue-router中history模式和hash模式的区别，需不需要后端配置，守卫，路由钩子
  vue是渐进式前端开发框架，为了构建SPA（单页面应用）需要引入前端路由系统：vue-router，核心就在于—改变视图的同时不会向后端发出请求
  hash模式：地址栏URL中的#符号，如：http://www.abc.com/#/hello，hash 的值为 #/hello；特点在于hash虽然出现在url中，但不会包括在http请求中，对后端没有影响，因此改变hash不会重新加载页面。
  history模式：利用了 HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法。应用于浏览器的历史记录栈，在当前已有的 back、forward、go 的基础之上，它们提供了对历史记录进行修改的功能。只是当它们执行修改时，虽然改变了当前的 URL，但浏览器不会立即向后端发送请求
  参考链接

• 写一个通用组件需要考虑哪些问题
  高性能、低耦合
  简书
  「1」数据从父组件传入
  子组件本身不生成数据，即使生成了，也只能在组件内部运作，不能传递出去。
  父对子使用props传参，对 props 传递的参数应该添加一些验证规则

「2」在父组件中处理事件
事件的处理尽量放到父组件中，如复选框的change事件，按钮的click事件；通用组件本身作为一个中转
「3」slot
在封装组件的时候，只需要完成组件80%的功能，剩下的让父组件通过slot完成
slot：slot详情
掘金
「4」不要依赖vuex
父子组件通过props传参，非父子之间通常使用vuex传参。Vuex类似于全局变量，会一直占用内存。
「5」合理运用scoped编写css
在编写组件的时候，可以在