KnockOut理解ko.computed函数在return语句中的最后一个“this”引用

Question

I am trying to understand what the use of the last this in the following tutorial example

function AppViewModel() {
    this.firstName = ko.observable("Bert");
    this.lastName = ko.observable("Bertington");

    this.fullName = ko.computed(function(){
    return this.firstName() + " " + this.lastName();
    },this);//This one!
}

I understand that the other this 's pertain to the AppViewModel() being constructed and when I remove the comma and last this the example doesn't bind any data. With the this.fullName wouldn't that be sufficient to bind that function to the AppViewModel() ?

So as it stands the ko.computed(function()... is saying return the references within this object to firstName and lastName concatenated set to this instances fullName , what piece am I missing?

Answer 1

The problem isn't the assignment of the computed to this.fullName ; it has to do with the value of this inside the computed function. By default, the this in return this.firstName() + " " + this.lastName(); when evaluated in the context of the computed function is window .

To get around this, we typically capture this into a variable called self or that . ko.computed() provides a second way to capture this , and that's by passing it in as the second parameter. That is why your snippet will only work when you include the second this parameter.

See the full docs on Computed Observables (scroll down to Managing "this") for more details.