JavaScript - Функция прототипа против функции ViewModel?

Question

Мне интересно, есть ли причина предпочитать функцию прототипа/функцию viewModel над другой.

Допустим, вы хотели, чтобы представить целое 1234 как значение денег как 12.34€

Что я сделал, создать функцию прототипа на Number объекта:

Number.localeSeparator = 1.1.toLocaleString().substr(1, 1); 

Number.prototype.centToEuro = function (separator_string) { 
    if (!separator_string) { 
     separator_string = Number.localeSeparator; 
    } 
    return (this/100).toFixed(2).replace(".", separator_string) + "€"; 
} 

var vm = {myMoney: ko.observable(1234)}; 
ko.applyBindings(vm); 

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

<div data-bind="text: myMoney().centToEuro()"></div> 

Но вместо прототипа functio п, я мог бы также создать функцию ViewModel с почти таким же кодом, например, так:

var vm = { 
    myMoney: ko.observable(1234), 
    localeSeparator: 1.1.toLocaleString().substr(1, 1), 
    centToEuro: function (value_int, separator_string) { 
     if (!separator_string) { 
      separator_string = vm.localeSeparator; 
     } 
     return (value_int/100).toFixed(2).replace(".", separator_string) + "€"; 
    } 
} 
ko.applyBindings(vm); 

Используется в представлении, это будет выглядеть следующим образом:

<div data-bind="text: centToEuro(myMoney())"></div> 

Как вы можете сказать, два Строки HTML почти точно такой же длины и только изменяются в подходе. Итак, вопрос в том, какой подход предпочитает?

Answer 1

Учитывая, что centToEuro не имеет ничего общего с произвольными числами, но с конкретной моделью за деньги, с которой вы имеете дело, и что вы не должны распространять встроенные объекты-прототипы, перейдите для функции viewmodel.

Answer 2

Разве это не вопрос вашего вопроса, где поставить эту функцию?

Рассмотрите возможность использования расширителей для таких задач, как форматирование валюты и т. Д., Где вы устанавливаете один раз и используете везде. Просто пример:

ko.extenders.currency = function (target, option) { 
    target.amount = function() { 
     var amt = ko.unwrap(target); 
     var localeSeparator = 1.1.toLocaleString().substr(1, 1); 
     switch(option) { 
      case "Eur": 
       amt = (amt/100).toFixed(2).replace(".", localeSeparator) + "€"; 
       break; 
      default:; 
      } 
     return amt; 
    }; 
    return target; 
}; 

вид Модель:

myMoney: ko.observable("1234").extend({currency: "Eur"}) 

Markup:

<div data-bind="text: myMoney.amount()"></div>