javascript - 数据绑定(bind)的 secret 是什么？

Question

对于大多数 JS 框架和库来说，它们带来的值(value)通常表现为如何构建应用程序的新结构(Backbone、React)，或有效增强语言能力的新想法(Angular)，或者只是他们提供的方法经过充分测试，快速且非常方便(jQuery)。

通常他们提供的想法和方法都是相当简单的 JavaScript 用法，但背后有一个非常聪明的团队，他们找到有趣的方法来做事情，你可以仔细思考并可靠地猜测其内部是如何工作的。

但是，我一直无法思考将 JS 模型双向绑定(bind)到 View 组件的能力。该功能的核心秘诀是什么？通过用户输入更改内部变量很简单，但是反过来呢？您如何才能“知道”JS 变量何时发生更改，以便立即更新显示？肯定不能进行轮询，那怎么办？

Answer 1

每当 JS 的一个 block 运行该 Angular 时，它就会在该 block 完成执行时运行一个摘要周期。这基本上会检查所有可能更改并需要更新 View 的值。

如果 Angular 没有触发代码，那么它不会知道某些内容可能会发生变化，因此您的绑定(bind)可能会不同步。例如，如果你运行这样的东西

setTimeout(function() {$scope.myValue = '123'});

Angular 不会知道 myValue 发生了变化，而且它实际上不会更新 View 。这就是为什么 Angular 拥有自己的服务来完成所有事情。例如$timeout 或 $http。

如果你有一些 Angular 不知道的回调函数，那么你可以通过调用 $scope.$apply() 手动告诉它检查更改。