66

我已阅读文档并查看了react 背后的来源，但我不明白。

有人可以解释一下这是如何在幕后工作的，因为它对我来说就像魔法:)。

4

1 回答 1

99

所以它实际上相当简单，在基本层面上涉及两种类型的功能：

  1. 创建反应式上下文的函数（反应式函数）

  2. 使反应性上下文无效的函数（使函数无效）

  3. 两者兼得的功能。（我谎称有 3 个）

当您调用 areactive function时，它会创建一个context该流星全局存储并reactive function订阅invalidation回调的流星。传递给响应式函数的函数，或在其中运行的任何函数，都可以是一个invalidating function并且可以获取电流context并将其存储在本地。然后，这些函数可以在任何时候，例如在数据库更新或简单的计时器调用中，使context. 然后原件reactive function将接收该事件并重新评估自己。

这是使用流星函数的一步一步（注意Tracker.autorun曾经被称为Deps.autorun）：

Tracker.autorun(function(){ 
  alert("Hello " + Session.get("name"));
});

Session.set("name", "Greg");
  1. autorun 将函数作为其参数
  2. 在 autorun 运行这个函数之前，它会创建一个context
  3. autorun 将回调附加到context的失效事件
  4. 此回调将重新运行传递给 autorun 的函数
  5. 然后第一次运行该函数context。
  6. Meteor 将此context全局存储为当前活动的context
  7. 函数内部是另一个函数：Session.get()
  8. Session.get() 既是一个reactive function又是一个invalidating function
  9. Session.get 设置它自己的context并在内部将其与键“名称”相关联
  10. Session.get 从 meteor 全局检索当前上下文（自动运行的上下文）
  11. Session.get 注册到它自己的上下文的失效回调，只会使它的封闭上下文失效（在这种情况下，自动运行的上下文）
  12. 所以现在我们有 2 个上下文，autorun 和 session.get

  13. 当这些函数返回时，meteor 清理活动上下文全局变量

  14. Session.set 是另一个能够使context.

  15. 在这种情况下，我们将contextSession 创建的与键“name”关联的所有 s无效
  16. 所有这些contexts在失效时都会运行它们的失效回调。
  17. 这些回调只是使其封闭context的 s 无效（这是 Session.get 的设计，而不是无效回调必须做的）
  18. 那些封闭contexts的现在运行它们的失效回调。
  19. 在自动运行的情况下，该回调运行我们最初传递给自动运行的函数，然后context再次设置。

整个实现实际上也相当简单，你可以在这里看到它：
https ://github.com/meteor/meteor/blob/master/packages/tracker/tracker.js

一个很好的例子可以在这里找到：
https ://github.com/meteor/meteor/blob/master/packages/reactive-dict/reactive-dict.js

反应式编程实际上不是流星或 JS 特定的
，您可以在此处阅读：http ://en.wikipedia.org/wiki/Reactive_programming

于 2012-04-24T07:43:35.740 回答