Создание яваскрипта нокаута ViewModel без нового ключевого слова

Question

Я ищу через выбивные учебники, и все примеры создания модели представления, используя «новое» ключевое слово:

//from learn.knockoutjs.com 
function AppViewModel() { 
    this.firstName = ko.observable("Bert"); 
    this.lastName = ko.observable("Bertington"); 
    this.fullName = ko.computed(function() { 
    return this.firstName() + " " + this.lastName();  
    }, this); 
} 
ko.applyBindings(new AppViewModel()); 

Я пытаюсь избегать использования новое ключевое слово, которое обычно работает отлично, но я нахожусь в затруднении, чтобы работать с полным вычислительным свойством. Это то, к чему я придумал.

function makeViewModel() { 
    return { 
    firstName: ko.observable("Bert"), 
    lastName: ko.observable("Bertington"), 
    fullName: ko.computed(function() { 
    return this.firstName() + " " + this.lastName();  
    }, this) }; 
} 
ko.applyBindings(makeViewModel()); 

... который, очевидно, терпит неудачу, поскольку «это» больше не относится к локальному объекту внутри функции, переданной для вычисления. Я мог бы обойти это, создав переменную и сохранил модель представления, прежде чем присоединять вычисляемую функцию и вернуть ее, но если существует более элегантное и компактное решение, которое не требует от меня проверки того, что методы, зависящие друг от друга, прикрепленный в правильном порядке, я бы хотел использовать это вместо этого.

Есть ли лучшее решение?

Answer 1

При создании в функции нет необходимости возвращать новый объект. Вместо этого вы бы сделали:

var ViewModel = function() { 
    this.firstName = ko.observable("Bert"); 
    this.lastName = ko.observable("Bertington"); 
    this.fullName = ko.computed(function() { 
     this.firstName() + " " + this.lastName(); 
    }, this); 
}; 

Теперь у вас есть доступ к соответствующему этому в вычисленном наблюдаемом.

Если вы действительно не хотите использовать «новый» (нет никаких причин, почему вы не должны в этом случае), то вы могли бы сделать что-то вроде:

var createViewModel = function() { 
    var result = { 
     firstName: ko.observable("Bert"), 
     lastName: ko.observable("Bertington") 
    }; 

    result.fullName = ko.computed(function() { 
     return result.firstName() + " " result.lastName(); 
    }); 

    return result; 
}; 

Answer 2

Вы можете исполнять новый, как так (взято из this great pattern resource)

function Waffle() { 
    if (!(this instanceof Waffle)) { 
    return new Waffle(); 
    } 

    this.tastes = "yummy"; 
} 

Однако я не уверен, что вы имеете в виду

Я стараюсь избегать использования -го e новое ключевое слово, которое обычно работает отлично, но я нахожу, что проблема в том, чтобы получить fullName, вычисленное , свойство работать. Это то, к чему я придумал.

Это должно хорошо работать, можете ли вы показать нам конкретный пример в jsfiddle, который не работает с использованием нового.

Надеюсь, это поможет.

Answer 3

Вы можете наверняка обойти новое ключевое слово, сделав функцию self invoking, но я думаю, что вам лучше решить проблему ключевого слова «this». Мне нравится показывать людям 3 способа создания viewmodels.

1. литерал объекта http://jsfiddle.net/johnpapa/u9S93/
2. как функция http://jsfiddle.net/johnpapa/zBqxy/
3. с разоблачающий модуля Pattern http://jsfiddle.net/johnpapa/uRXPn/

При использовании вариант 2 или 3 выше, гораздо легче иметь дело с "это" ключевое слово.