Beginner Knockoutjs Record 7--computed observables dependency monitoring (4 pure Computed observables Pure compute monitoring properties)

Source: Internet
Author: User

Pure computed observables purely computed monitoring properties

The Pure Computational monitoring attribute is introduced in knockout3.2.0, which provides a better choice of speed and memory performance for conventional computational monitoring properties in most cases. This is because the purely computed monitoring property does not need to maintain its dependency if it is not subscribed to itself.

It's features:

    prevents memore leaks prevents memory leaks. The Pure compute monitoring property is no longer a program reference, but its entire dependency remains.

reduces computation oberhead reduces computational overhead. Calculation of the Monitoring property is no longer calculated when the value is no longer being monitored.

The Pure compute monitoring property is based on whether it contains an automatic switchover of update subscriptions in two states:

1. When it is no longer subscribed, it will be in hibernation (sleeping). When it goes into hibernation, it discards all dependent subscriptions, and in this state it does not subscribe to any monitoring dependencies in the calculation function (although still keeping track of them). If the value of the computed monitoring property is read in the sleep state, it will be automatically recalculated in the case of any dependent changes.

2. Whenever any subscription changes, it is activated and enters the listening state (listening). When it enters the listening state, it subscribes to any dependencies immediately, in which case it behaves like a normal computed monitoring attribute, as described in the previous section (how dependency tracking works).

Why "pure"?

We draw on this concept from pure functions, which is generally applicable only to computed monitoring properties with pure computational functions:

1. Evaluation of the calculation of the monitoring properties should not cause side effects;

2. The value of the calculated monitoring attribute should not vary with multiple calculation functions or other hidden information, and its value should depend on only other single monitoring properties.

Syntax syntax

The standard way to define a purely computed monitoring property is to use ko.purecomputed:

this. FullName = ko.purecomputed (function () {    returnthis""  this);    

As an option, you can also use the pure option in ko.computed:

this. FullName = ko.computed (function () {    returnthis""  This  thistrue });

Refer to the complete syntax for reference to computed Observalbe reference.

When touser a pure computed observable use pure compute monitoring properties

You can refer to pure function guidelines using pure compute monitoring properties. It is useful when your application needs to design a solution to use and share the view model in a template view and a view model. The use of pure compute monitoring Properties provides a high-performance way of computing when persisting the view model, providing an efficient way to manage memory in the template view .

In the example of a simple wizard below, the FullName pure compute monitoring property is only updated when the last step is bound to the view and only when this step is activated.

<divclass="Log"Data-bind="Text:computedlog"></div><!--koif: Step () = =0-<p>first Name: <input data-bind="Textinput:firstname"/></p><!--/ko--><!--koif: Step () = =1-<p>last Name: <input data-bind="Textinput:lastname"/></p><!--/ko--><!--koif: Step () = =2-<div>prefix: <SelectData-bind="value:prefix, Options: [' Mr. ', ' Ms . ', ' Mrs. ', ' Dr. ']"></Select></div> "Text:fullname"> </span>!"Button"Data-bind="Click:next">Next</button></p>function AppData () { This. FirstName = Ko.observable ('John');  This. LastName = Ko.observable ('Burns');  This. prefix = ko.observable ('Dr.');  This. Computedlog = Ko.observable ('Log:');  This. FullName =ko.purecomputed (function () {varValue = This. prefix () +" "+ This. FirstName () +" "+ This. LastName (); //Normally, should avoid writing to observables within a pure computed//observable (avoiding side effects). But this example was meant to demonstrate//Its internal workings, and writing a log is a good a-to-do.         This. Computedlog ( This. Computedlog.peek () + value +'; '); returnvalue; },  This);  This. Step = Ko.observable (0);  This. Next =function () { This. Step ( This. Step () = = =2?0: This. Step () +1); };}; Ko.applybindings (NewAppData ());


When the not-to-use a pure computed observable is not suitable for using pure compute monitoring properties

Side effects of Side effects

You should not use the computed monitoring attribute in a way that performs an action when his dependency changes, see the following example:

Call the callback function using a computed monitoring property with multiple dependencies;

ko.computed (function () {    var vleandata = Ko.tojs (this);     this);

Bind the INIT function to update the bound element with the computed monitoring property

ko.computed ({    read:funtion () {        = ko.unwrap (valueaccessor ());    },    Disposewhennodeisremoved:element});    

  The reason you should not use the purely computed monitoring property is that if the calculation function has an important effect then it will not be called when the subscription is not activated (such as the Sleeping state). If you need to always be able to get a response from a computational function when dependent on changes, you should use the regular calculation monitoring properties.

Determining if a property is a pure computed observable detects an attribute that is a purely computed monitoring property

In some scenarios, you may need to detect whether the processing is a computed monitoring attribute, and knockout provides a tool function that ko.ispurecomputed to accomplish this purpose. For example, you want to exclude data from non-pure compute monitoring properties from data sent to the server.

var result = {};ko.utils.objectforeach (myObject, function (name, value) {    if (! ko.iscomputed (value) | | ko.ispurecomputed (value)) {        = value;    }});    

State-change Notifications Status Change notification

The Pure compute monitoring property triggers the Awake event (using its current value) when it enters the listening state (listening), triggering the asleep event when it enters the hibernation state (sleeping). The internal state can be detected regardless of whether the computed monitoring property is bound to the view, so you can use this information to do something when the view model is initialized or cleared

 This. Somecomputedthatwillbebound =ko.purecomputed (funtion () {...}, This); This. Somecomputedthatwillbebound.subscribe (Funtion () {//Do Somethig If this is bound}, This,"Awake"); This. Somecomputedthatwillbebound.subscribe (function () {//Dom Somethig when this is Un-bound}, This,"asleep");

(TheAwake event is also available in the general calculation monitoring properties, created with the deferevaluation option )

Beginner Knockoutjs Record 7--computed observables dependency monitoring (4 pure Computed observables Pure compute monitoring properties)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.