knockoutのsubscribe

Knockout Advent Calendar 2015

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-debug.js"></script>
<script src="https://mbest.github.io/knockout.punches/knockout.punches.js"></script>
<script src="https://rawgit.com/SteveSanderson/knockout-es5/master/dist/knockout-es5.js"></script>
あなたの名前は?:<input type="text" data-bind="value:myName">

<div>こんにちは!{{myName}}さん</div>

JavaScript

function VM(){
    this.myName= "山田";
    ko.track(this);
    ko.getObservable(this,'myName').subscribeChanged(function(myName,old){
        alert('名前が、'+old+'から、'+myName+'に変わりました');
    });
};

ko.subscribable.fn.subscribeChanged = function (callback) {
alert(callback);
    var savedValue = this.peek();
    return this.subscribe(function (latestValue) {
        var oldValue = savedValue;
        savedValue = latestValue;
        callback(latestValue, oldValue);
    });
};

var vm = new VM();

ko.punches.enableAll();
ko.applyBindings(vm);