DMQ před 9 roky
rodič
revize
32b0cbbc2d
1 změnil soubory, kde provedl 13 přidání a 13 odebrání
  1. 13 13
      readme.md

+ 13 - 13
readme.md

@@ -1,13 +1,12 @@
 ## 剖析Vue实现原理 - 如何实现双向绑定mvvm
 
 > 本文能帮你做什么?
-1、了解vue的双向数据绑定原理以及核心代码模块
-2、缓解好奇心的同时了解如何实现双向绑定
+> 1、了解vue的双向数据绑定原理以及核心代码模块
+> 2、缓解好奇心的同时了解如何实现双向绑定
 > 为了便于说明原理与实现,本文相关代码主要摘自[vue源码](https://github.com/vuejs/vue), 并进行了简化改造,相对较简陋,并未考虑到数组的处理、数据的循环依赖等,也难免存在一些问题,欢迎大家指正。不过这些并不会影响大家的阅读和理解,相信对大家在阅读vue源码的时候会更有帮助
 > 本文所有相关代码均在github上面可找到 [https://github.com/DMQ/mvvm](https://github.com/DMQ/mvvm)
 
-##### 相信大家对mvvm双向绑定应该都不陌生了,什么?还没了解过?骚年,out了,赶紧google一下吧。
-一言不合就上代码,下面先看一个本文最终实现的效果吧,和vue是一样的语法
+##### 相信大家对mvvm双向绑定应该都不陌生了,一言不合就上代码,下面先看一个本文最终实现的效果吧,和vue一样的语法,如果还不了解双向绑定,请看[这里]()
 
 ```
 <div id="mvvm-app">
@@ -39,20 +38,21 @@
 ![demo1][demo1]
 
 
-##### 几种实现双向绑定的做法
-目前几种较为主流的双向绑定实现
+#### 几种实现双向绑定的做法
+目前几种主流的mvc(vm)框架都实现了数据绑定,而我所理解的双向数据绑定无非就是在单向绑定的基础上给可输入元素(input、textare等)添加了change(input)事件,来动态修改model --> view,其实并没有多高深。所以无需太过介怀单向或双向绑定。
 
+实现数据绑定的做法有大致如下几种:
 
-#### 3、目前实现数据绑定的几种做法
-
-
-> 观察者模式(backbone.js)
+> 发布者-订阅者模式(backbone.js)
 > 
 > 脏值检查(angular.js) 
 > 
-> 数据劫持(vue.js) 
+> 数据劫持(vue.js,ember.js) 
+
+**发布者-订阅者模式:** 一般通过sub, pub的方式实现数据和视图的绑定监听,更新数据方式通常做法是 `vm.set('property', value)`,这里有篇文章讲的比较详细,有兴趣可点[这里](http://www.html-js.com/article/Study-of-twoway-data-binding-JavaScript-talk-about-JavaScript-every-day)
+
 
-观察者模式一般通过sub, pub的方式实现数据和视图的绑定监听,更新数据方式通常 `vm.set('property', value)`, 这种方式现在毕竟太low了,我们更希望通过 `vm.property = value `这种方式更新数据,同时自动更新视图。
+这种方式现在毕竟太low了,我们更希望通过 `vm.property = value `这种方式更新数据,同时自动更新视图。
 
 angular.js 是通过脏值检测的方式比对数据是否有变更,来决定是否更新视图,最简单的方式就是通过 `setInterval()` 定时轮询检测数据变动,当然Google不会这么low,angular只有在指定的事件触发时进入脏值检测,大致如下:
 
@@ -123,4 +123,4 @@ defineReative(data);
 
 [code](./js/watcher.js)
 
-[demo1]: ./img/1.gif
+[demo1]: ./img/1.gif