vue 数组添加多个值_前端进阶面试（vue + es6 + js）

以下内容仅为个人见解，如有错误欢迎指正~

以下内容仅为个人见解，如有错误欢迎指正~

vue

双向绑定

原理：
      vue.js 则是采用数据劫持结合发布者-订阅者模式的方式，
      通过Object.defineProperty()来劫持各个属性的setter，getter，
      在数据变动时发布消息给订阅者，触发相应的监听回调。
延伸：
      *  Object.defineProperty() 是ES5 中一个无法 shim 的特性， 这也就是 Vue 不支持 IE8 以及更低版本浏览器的原因。
        *  Object.defineProperty(对象，属性，属性描述符) 用于在一个对象上定义一个新的属性， 或者修改一个对象现有的属性，并返回这个对象
实现：
    通过Obeject.defineProperty()来监听数据属性变动，将数据对象进行递归遍历，包括子属性对象的属性，都加上 setter和getter。
    详解：
        *实现一个监听器Observer：
                给对象的某个值赋值 ==> 触发setter（监听到数据变化）==> 通知订阅者（notify(在调用订阅者的update方法)）
        *实现一个订阅者Watcher：
                可以收到属性的变化通知并执行相应的函数，从而更新视图。（getter（const dep = new Dep();然后清空，减少性能浪费））
        *实现一个解析器Compile：
                可以扫描和解析每个节点的相关指令，并根据初始化模板数据以及初始化相应的订阅器。

watch | computer

共同点：
        希望在数据发生改变的时候，数据根据预先定义好的函数，发生“自动”的变化。
区别：
        watch擅长处理的场景：一个数据影响多个数据
        computed擅长处理的场景：一个数据受多个数据影响

组件传值

父改子：
      ref  $ref
  父传子：
      props
  子传父：
      $emit
  兄弟组件：
      $on
  通用：
      利用缓存（store locationstrage 后端....）

延伸：vue监听子组件生命周期