Menu

Subscribing to KnockoutJs ECMAScript 5 Plugin Observables

Knockout JS offers manual subscribing to observables, so that arbitrary code can be executed whether the observable value changes. This might be useful to update user interface when value changes, or to perform AJAX requests based on value of observable. For instance filters can be implemented, which will pull new data according to observable value. 

When using bare KnockoutJS the observable itself is object having method subscribe. Example of subscribing in bare KO:

app.model.filter.active.subscribe(function(newValue) {
    console.log("Perform AJAX request with: " + newValue);
});

However, when using EcmaScript 5 plugin, which allows using observables without parenthesis, the subscribe method is not available. The value of active field would appear as a plain JavaScript type, for instance boolean value. Luckily the KO have the method to obtain real observable with ko.getObservable where first parameter is view model, the latter one is observable name. The resulting code is a bit different that that from the bare KnockoutJS in terms of getting access to subscribe method:

ko.getObservable(app.model.filter, 'active').subscribe(function(newValue) {
    console.log("Perform AJAX request with: " + newValue);
});

When added explicit subscription with method above, just setting model value would execute function passed to subscribe method:

app.model.filter.active = true;
// console logs: Perform AJAX request with: true

Isolating scope with self executing anonymous function in PHP

From some time, PHP offers closures called also anonymous functions. The anonymous function works somewhat different than JavaScript equivalent. In JavaScript all variables are available in closure if they are defined in same scope as closure. Let's make an example in JavaScript, so that will be a bit cleaner:

// Variable $name is *outer* for $greet function
var $name = 'Joe';
var $greet = function() {
    console.log($name); // $name is `Joe` here.
}

In PHP however, these outer variables are not automatically available in function. In fact these variables are copied (with exception to objects), just like when passing variable as function argument. They need to be passed with use keyword. Equivalent in PHP:

// Variable $name is *outer* for $greet function
$name = 'Joe';
$greet = function() use ($name) {
    echo $name; // $name is `Joe` here.
}

Collecting Interface Implementations with Signals

When using our favorite IDE, we usually have option to find all implementations of interface. This gives us overview of available classes that can do certain operations or have certain purpose. When developing modular application the new types might appear when we install additional dependencies. As well some implementations - through less common - could possibly disappear on dependency upgrade. We have developers tools to to keep our applications up to date to our or external vendor dependencies. But, hey we are developers who do not like to track manually all changes, as it's error prone and tedious. For instance if we have some notification interface and bunch of notifiers. At some point we need to collect those notifiers and notify with them about our application action. The other example might product interface indicating that class represents some kind of product in our system. Then when creating new product, we've had to choose which one from the list of all implementations of product interface. To avoid hardcoding such list of available implementations we could use configuration file to set up all available options. But that's in fact hardcoding configuration, as it would likely be committed with code.

Introducing Mangan Aspects

The Mangan project has now a new features called Aspects. This feature allows adding extra information on what is going on with our data model. Most importantly, this allows several different aspects to be present at the same time. This allows application logic to react differently in many cases, depending on so called point of view. In other words, the data model can have now many different states or scenarios (called aspects) at once. Application component which receives data model, can check if particular state exists and react accordingly or skip some operations. This might be also used to perform more heavy operations only when really necessary.