2

Tenho o seguinte código, e na função de mudança, eu quero passar uma variável como parâmetro, e não o valor dela, e não sei como fazer isso. Porque quero que a função faça o "listen" da variável, e não do valor dela, assim quando eu atribuir um novo valor a variável status, o evento de mudança será disparado.

let status = true;

function onChange(value, callback) {
    let aux = value;
    setInterval(() => {
        if(value != aux) {
            aux = value;
            callback();
        }
    }, 100)
}
onChange(status, () => {
    console.log('Valor Mudou');
});
status = false;
//a saída ira disparar o evento de mudança, percebendo que a variável status agora é falsa, entretanto isso não acontece pois ele está pegando o valor dela, e não a variável em si.
5
  • Você não poderia simplesmente utilizar get/set?
    – Francisco
    Commented 22/01/2019 às 23:23
  • @Francisco, get/set resolveria de fato, mas aí precisaria rescrever todos os atributos que quero fazer o listen, criando seus getters e setters. E não queria ter que reescrever, por isso estou tentando fazer algo mais genérico, não sei se é possível, mas seria isso.
    – Raizant
    Commented 22/01/2019 às 23:31
  • Acho que as únicas formas de fazer isso que quer é com getters e setter ou com Proxy
    – Costamilam
    Commented 23/01/2019 às 0:04
  • Se você só tiver objetos, você consegue sim passar seu valor com a referencia do objeto original. Dai você conseguiria implementar a solução que está na pergunta.
    – Francisco
    Commented 23/01/2019 às 0:07
  • Sim @Francisco, o problema é que estou fazendo isso para um código extenso e antigo, eu teria que rescrever todas as variáveis, os métodos que usam essas variáveis, e por aí vai. Teria que transformá-los em objeto, criar get/set. No fim isso vai aumentar o meu trabalho, dessa forma, eu faria um listen especifico para cada variável: statusOnChange() e lá dentro iria dizer que quero verificar o valor da variável status, no entanto como eu disse, queria fazer algo mais genérico, que pudesse ser reaproveitado. Pela quantidade de código, no momento get/set não vai me ajudar. :(
    – Raizant
    Commented 23/01/2019 às 0:13

1 Resposta 1

3

A única maneira de fazer isso é com um setter. Assim quando o valor mudar a callback vai ser corrida de novo. Isso é o que está por trás da reactividade do Vue.js por exemplo.

Deixo um exemplo. A ideia é ter getters/setters à lá ES6 e ter uma array onde guardas as callbacks para uma dada variável/nome. Não dá para usar variáveis diretamentes porque em JavaScript não é possível, mas propriedades de um objeto já dá usando os tais getters/setters.

const reactors = {}; // arrays de callbacks
const reactivos = {}; // as variáveis que vais mudar
const store = {}; // onde guardas os valores reais, isto seria uma propriedade privada de uma classe. Ou seja não deves mudar diretamente aqui, só via setter.

// define o getter/setter para "status"
function registarNome(nome, init) {
  store[nome] = init;
  if (!reactors[nome]) {
    reactors[nome] = [];
  }
  
  Object.defineProperty(reactivos, nome, {
    get() {
      return store[nome];
    },
    set(val) {
      store[nome] = val;
      reactors[nome].forEach(fn => fn(val));
    }
  });
}

// registar e inicialisar a variável
registarNome('status', true);


function onChange(nome, callback) {
  reactors[nome].push(callback);
}

// registar o auscultador de mudanças
onChange('status', (val) => {
  console.log('Valor mudou para ', val);
});

// mudanças que vão chamar a callback
reactivos.status = false;
reactivos.status = true;

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .