Meteor的FRP实现 - Tracker模块
Meteor平台的FRP实现是通过内置的Tracker包完成的。在Meteor平台上实现反应式 计算可分为三个步骤:
- 将原始数据使用getter/setter进行封装
- 编写依赖于反应式数据的计算过程
- 启动反应式计算过程
可以认为Meteor的FPR实现,一半是Tracker包中的代码,一半是对开发者编写代码的要求。 需要提醒的是,Tracker包只可以用在前端。
≡ 封装反应式数据
Tracker要求对数据的存取通过getter/setter接口进行。使用getter接口 读取数据时,数据的封装者负责记录依赖于该数据的计算过程;使用setter接口 修改数据时,数据的封装者负责传播数据变化 - 即调用所有已经记录的依赖于该数据 的计算过程:
Tracker定义了一个类Tracker.Dependency来简化数据封装者在实现getter/setter 时要做的工作。对每一个需要进行封装的数据,我们创建一个对应的Dependency对象。 在getter里,使用Dependency对象的depend()方法登记依赖于此数据的计算过程; 在setter里,使用Dependency对象的changed()方法调用登记过的依赖于此数据的 计算过程。
var A = 10;
var depsA = new Tracker.Dependency();
//getter
var getA = function(){
despA.depend();
return A;
};
//setter
var setA = function(nv){
A = nv;
despA.changed();
}
≡ 封装计算过程
Tracker要求我们使用无参函数来表示一个计算过程:
//计算过程,Tracker使用这个函数创建计算块
var computeFunc = function(){
//当调用getA或getB时,Tracker创建的计算块将被登记到depsA或depsB的依赖项记录表中
var a = getA(),
b = getB(),
c = a + b;
console.log(a + " + " + b + " = " + c);
};
≡ 启动反应式计算
使用Tracker.autorun(computeFuc)方法来启动反应式计算:
Tracker.autorun(computeFunc);
≡ 测试反应式计算
现在我们就可以写一段测试代码了,记住,Tracker要求我们必须通过setter 接口来修改数据:
var seq = 0;
setInterval(function(){
if(seq % 2 === 0)
setA(parseInt(Math.random()*1000));
else
setB(parseInt(Math.random()*1000));
seq++;
},1000);
执行以下命令复位test应用、删除源文件:
~/test$ meteor reset↵
~/test$ rm -rf \*↵
执行以下命令拷贝frp-tracker示例代码,运行并查看运行结果:
~/test$ cp ~/demos/frp-tracker/* .↵
~/test$ meteor↵
理解并修改frp-tracker示例代码,通过练习掌握在Meteor应用中如何使用Tracker 实现反应式计算。