Observar as alterações nas propriedades de um objeto sempre foi uma tarefa muito procurada; muitos shims foram usados ao longo dos anos para ouvir as alterações nos objetos. Atualmente, temos métodos melhores para ouvir as alterações de objetos: a API Proxy. Sindre Sorhus criou on-change, uma pequena ferramenta JavaScript que permite que o senhor ouça as alterações em objetos e matrizes JavaScript!
on-change JavaScript
Como o código de alteração é muito pequeno, aqui está ele em sua glória completa:
'use strict'; module.exports = (object, onChange) => { const handler = { get(target, property, receiver) { try { return new Proxy(target[property], handler); } catch (err) { return Reflect.get(target, property, receiver); } }, defineProperty(target, property, descriptor) { onChange(); return Reflect.defineProperty(target, property, descriptor); }, deleteProperty(target, property) { onChange(); return Reflect.deleteProperty(target, property); } }; return new Proxy(object, handler); };
O onChange
retorna um proxy que o senhor usará para fazer qualquer alteração no objeto.
Usando o on-change
Passe onChange
o objeto que o senhor gostaria de espionar e uma função de tratamento de alterações:
let j = { a: 1 }; // Upon change, save to server let changeable = onChange(j, () => save(j));
Em seguida, use esse proxy para alterar as propriedades e ser notificado sobre as alterações:
// Make a change that would trigger changes changeable.a = 2; // save() is triggered! // j.a === 2
Observe que os valores do objeto original também mudam – essa é a beleza do Proxy! Observe também que o on-change não informa qual propriedade foi alterada; o caso de uso, como Sindre descreve, é salvar um objeto (no servidor etc.) quando qualquer parte de um objeto é alterada. O senhor também poderia usá-lo para uma pequena biblioteca com uma função de renderização, renderizando novamente o conteúdo sempre que uma propriedade for alterada!
Essa biblioteca on-change é muito boa se o senhor não precisar saber qual propriedade foi alterada, apenas que alguma coisa mudou.