Создание JavaScript-модели нокаута без нового ключевого слова - PullRequest
2 голосов
/ 17 марта 2012

Я просматриваю учебные материалы по выбыванию, и во всех примерах создается модель представления с использованием ключевого слова 'new':

//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());

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

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

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

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

Ответы [ 3 ]

5 голосов
/ 17 марта 2012

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

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

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

3 голосов
/ 17 марта 2012

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

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

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

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

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;
};
0 голосов
/ 17 марта 2012

Вы можете применить новое как так (взято из этого большого ресурса шаблона )

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

    this.tastes = "yummy";
}

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

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

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

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...