avalon有关ViewModel与Model的同步问题

经过几天的讨论,基本上确定了avalon的几个重要元素的关系。

M,即model,一个普通的JS对象,可能是后台传过来的,也可能是直接从VM中拿到,即VM.$json。有关的这个$json的名字还在商讨,详见这里

V,即View,HTML页面,通过绑定属性或插值表达式,呈现数据,处理隐藏,绑定事件或动画等各种交互效果。V只与VM打交道。

VM,即ViewModel,我们通过avalon.define("xxx", function(vm){vm.firstName = "正美"}),这里的vm是一个临时的对象,用于定义,真正的VM是avalon.define方法的返回值。它上面的$json属性就是M,可以见VM处于一切的核心。我们对VM的每一个操作,都会向上同步到V,向下同步到M。并且出于节能低碳起见(减少对象的创建),我们在生成M时,会重复利用VM中的一些属性,比如vm的某个属性是一个对象,那么这个对象会直接搬到$json中。若它是一个数组,它里面每个元素为对象,这些数组或对象都会直接$json中去,当然有时会修复一下(比如计算属性会转换一个简单的数据类型)

下面是一个够为直观的例子:

            var b = {name: "xxx", eee: "ooo"}
            var array = [{name: "xxx"}, {title: "yyy"}]
            var a = avalon.define("xxx", function(vm) {
                vm.firstName = "司徒";
                vm.lastName = "正美";
                vm.nick = b;
                vm.array = array;
            });
            console.log(a.nick.$json === b);//true
            console.log(a.array.$json == array);//true
            console.log(a.array.$json[0] === array[0]);//true
            console.log(a.array[0].$json === array[0]);//true
            console.log(JSON.stringify(a.$json));//{"firstName":"司徒","lastName":"正美","nick":{"name":"xxx","eee":"ooo"},"array":[{"name":"xxx"},{"title":"yyy"}]}

你可能感兴趣的:(Model)