Use

on binds event handlers to property changes on an observable type. When you change a property value, a property name event is fired, allowing other parts of your application to map the changes to the object.

This event is useful for noticing changes to a specific property. .on works almost identically with can-define, can-simple-map, and can-observe.

const o = new DefineMap( { name: "Justin" } );
o.on( "name", function( ev, newVal, oldVal ) {
    console.log( "The value of a changed." );
} );

The parameters of the event handler for the property name event are:

• ev The event object.
• newVal The value of the property after the change. `
• oldVal The value of the property before the change.

Here is a concrete tour through the property name event handler's arguments:

var o = new DefineMap({a: undefined, b: undefined});
o.on('a', function(ev, newVal, oldVal) {
    console.log(newVal + ', ' + oldVal);
});

o.a = 'Alexis';       // Alexis, undefined
o.set('a', 'Adam');   // Adam, Alexis
o.set({
    'a': 'Alice',     // Alice, Adam
    'b': 'Bob'
});
o.a = undefined;      // undefined, Alice