vue初期学习笔记

编程范式

①命令式编程 (how to do)
EX:js/jquery
②声明式编程 what to do 框架(机器)帮助完成
EX:vue/react/angular

MVC——modle view controller(MVC)

modle: 操作的数据
view: body里面的内容
controller: script里面的内容

MVVM——modle view view_modle(MVVC)

view: DOM template
view_modle: VUE
modle: plain js object data、methods…

条件-列表渲染-diff算法

diff算法就是将旧的VNodes和新的Vnodes进行对比的过程，然后观察需要变换那些东西。

在用v-for便利数组时，如果是要更新(添加/删除)数组的内容

v-for进行渲染的时候，我们通常会给元素或者组件绑定一个key属性
没有加key的时候，vue的源码会执行patchUnkeyedChildren
三步：123
在加了key的时候，vue源码会执行patchKeyedChildren
五步：12345

计算属性(computed)和方法(methods)的区别

计算属性(computed)和方法(methods)的差别不大，但是计算属性是有缓存的。
分别console打印三次，computed只会出现一次，methods会打印三次。
data中的数据是响应式的，当修改了data中打印在界面上的数据时，会重新渲染，也就是说如上的methods中的打印在再次执行多次。而computed还是只会执行一次.

computed的get和set方法

• 普通写法:

  fullName: {
    get: function(){
      return this.firstName+" "+this.lastName;
    },
    set: function(newValue){
      console.log(newValue);
    }
  }

• 语法糖:

  fullName: function(){
    return this.firstName+" "+this.lastName;
  }