Backbone.js - Mudanças nos modelos

Javascript nos permite usar eventos assíncronos com os quais podemos gerar ações, devido a isso temos grande sucesso no uso de frameworks como jQuery que pode escutar uma mudança na árvore DOM e executar uma função enquanto o resto da página ainda está funcionando.
Acesso direto
Antes de ver como lidar com as mudanças dentro do modelo, um conceito-chave que devemos lidar é o acesso direto aos atributos, isso é graças a um atributo .atributos que está no modelo do qual herdamos para fazer o nosso.
ImportanteAo fazer uma atribuição de valores usando este método, pulamos que ele é detonado em nosso modelo e ao passar o atributo {silencioso: verdadeiro} todos os seus eventos são completamente silenciados.
Vamos ver no seguinte código de exemplo ao qual nos referimos:

Como podemos ver no exemplo ao usar {silencioso: verdadeiro} não detecta nenhuma mudança em nosso modelo.
Ouça as mudanças no modelo
Ouvir as mudanças em nossos modelos pode ser muito útil, pois podemos realizar diferentes ações, dando assim mais dinamismo à nossa aplicação.
No exemplo a seguir vamos imprimir uma linha indicando cada vez que um atributo muda, então vamos imprimir o valor do atributo, para isso no método inicializar do modelo, incluiremos uma chamada para no método e nós vamos te contar o que é o evento mudança que deve funcionar:

Se executarmos este código, obteremos uma linha para cada vez que o modelo muda e adicionalmente uma linha inicial quando o modelo é inicializado.
Vamos ver o que o resultado nos dá:

PROLONGAR

Vemos que temos duas linhas dizendo que o modelo mudou, esse valor coincide com as duas vezes que usamos o método ser () Para dar um valor aos atributos do modelo, também vemos como a linha de inicialização do modelo foi impressa.
Ouça as mudanças em um atributo específico
Está opção nos permite executar uma ação quando um determinado atributo mudaO que podemos conseguir com isso é que podemos direcionar ações diferentes, quer um atributo mude ou outro, com isso vamos conseguir uma independência muito mais dinâmica de eventos na aplicação.
Vamos ver no código a seguir como podemos fazer isso:

 var Todo = Backbone.Model.extend ({// Padrões de valores de atributos padrão: {title: '', concluído: ''}, inicializar: function () {console.log ('Este modelo foi inicializado'); this.on ('alterar: título', função () {console.log ('O valor do atributo do título mudou.');});}, setTitle: função (newTitle) {this.set ({título: newTitle} );}}); var myTodo = new Todo (); // Ambos os formulários acionam o evento de mudança: myTodo.set ('title', 'Colocamos um título inicial.'); myTodo.setTitulo ('Alteramos o título.'); myTodo.set ('concluído', 'Não dispara evento'); 

Na imagem a seguir, podemos ver como tudo fica depois de executar o código do exercício anterior:

PROLONGAR

Podemos consertar que apenas a alteração do atributo title dispara o evento, ao alterar o atributo concluído nada acontece e portanto nada é impresso pelo console.
Ao final deste tutorial já temos um conhecimento muito mais amplo a respeito do tratamento dos diferentes eventos de nossa aplicação em Backbone.js.Gostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo