This piece is mainly a theoretical explanation, I just touch this piece soon, I dare not translate, please see the Garden of other people's existing article http://www.cnblogs.com/TomXu/archive/2011/11/22/2256820.html
Article content:
Novice does not need to know too clearly, but advanced developers can need to know why dependency monitoring properties can automatically track and automatically update the UI ...
In fact, it's very simple, even cute. The logic for tracing is this:
- When you declare a dependent monitoring property, Ko calls the execution function immediately and gets the initialization value.
- When your execution function is running, KO will log all dependent properties (or monitoring dependency properties) to a log list.
- After the execution function finishes, the KO will subscribe to all the objects in the log that need to be relied upon. The callback function of the subscription is to rerun your execution function. Then go back to the first step above (and sign out of the subscription you are no longer using).
- The last Ko will notify the upstream of all subscribers subscribing to it and tell them that I have set the new value.
All said, Ko not only detects your dependencies the first time the function executes, it detects them every time. For example, your dependency property can be dynamic: dependency property A represents whether you rely on dependency property B or C, and the execution function executes only if a or your current selection B or C changes. You do not need to declare other dependencies: The runtime detects them automatically.
Another technique is that the binding of a template output is a simple implementation that relies on the monitoring property, and if the template reads a value from a monitoring property, the template binding automatically becomes dependent on the monitoring property, and when the monitoring property changes, the dependency monitoring property of the template binding is automatically executed. Nested templates are also automatic: if template x is rendered template y, and y needs to display the value of the monitor attribute Z, when z changes, only y depends on it, so only Y is redrawn (render).
Using Peek to control dependencies (controlling dependencies using Peek)
(Note: The specific role of peek is still useless, but also do some targeted scenes to do the verification, the current document-based understanding, may be to prevent circular reference when the role of relatively large)
Knockout will automatically track dependencies, but sometimes it may not work for us, we may need to manually control which dependencies need to be updated (I have not yet encountered this scenario), especially if computed observable has a series of actions, such as AJAX requests. The Peek function can access observable or computed observable without creating dependencies.
In the following example, computed observable is used to reload Currentpagedata using AJAX, which relies on two observable properties. Computed observable is updated when the pageindex changes, but the SelectedItem changes are ignored because it is accessed using peek. In this example, SelectedItem may only be used for tracking when the data is reloaded (that is, it uses only its value, but its value changes, and does not reload the data (to be verified)).
Ko.computed (function() { var params = { this. PageIndex (), This . Selecteditem.peek () }; $.getjson (this);
Note: You can use the extender extension to prevent computed observable from being updated too often.
Note: Why circular dependence is meaningless
Computed observable should have a lot of observable input, but only one value output. Therefore, there should be no loops in your dependency chain. Loops and recursion are not the same, it's more like two of cells in Excel referencing each other. It will cause an infinite loop.
What does knockout do when this happens? It does this to prevent this from happening: When the calculation is already knockout, the next calculation will not be performed again. This will not affect your code. There are two cases when two computed observables are interdependent (perhaps one or both use the deferevaluation option), or one computed observable to another observable it relies on ( Either direct, or it may be related through a dependency chain. If this is the case and you need to avoid cyclic dependencies, you need to use the PEEK function.
How dependency tracking works (how dependency tracking works)