2

Com JavaScript (ECMAScript-6), ao chamar um método via callback, caso esse método utilize um outro método ocorre o seguinte erro:

Uncaught TypeError: Cannot read property 'nome_do_metodo_secundario' of undefined

Se o método é chamado diretamente funciona perfeitamente. Porém se for chamado via callback não funciona. Se não tiver um método secundário, também funciona.

Como fazer para chamar via callback, um método de uma classe, sendo que este método utiliza outros métodos?

Abaixo um trecho de código reproduzindo o erro:

class TestOne{
    metodoPrincipal(str_input){
        this.metodoSecundario(str_input);
    }
  
    metodoSecundario(parametro){
        alert("OK: " + parametro);
    }     
}

function chamaViaCallback(callback, msg){
  callback(msg);
}


var test_objeto = new TestOne(); // instancia o objeto

 // funciona chamando diretamente um método secundário
test_objeto.metodoPrincipal('Testando método secundário chamado diretamente!');

// funciona via callback chamando diretamente o método secundário
chamaViaCallback(test_objeto.metodoSecundario, 'método único chamado via callback!');

// não funciona via callback chamando método secundário
chamaViaCallback(test_objeto.metodoPrincipal, 'método secundário chamado via callback!');

3 Respostas 3

3

Esse problema ocorre porque a função metodoPrincipal perde a referência do objeto.

Uma forma de resolver isto é passar o objeto através do bind:

chamaViaCallback(test_objeto.metodoPrincipal.bind(test_objeto), 'Foo');

Uma outra alternativa com uma função de seta (Arrow function):

chamaViaCallback( msg => test_objeto.metodoPrincipal(msg), 'Bar');

Se preferir chamar a função de seta sem argumentos e passar diretamente a mensagem:

chamaViaCallback( () => { test_objeto.metodoPrincipal('Baz'); } );

Exemplo:

class TestOne{
    metodoPrincipal(str_input){
        this.metodoSecundario(str_input);
    }
  
    metodoSecundario(parametro){
        console.log("OK: " + parametro);
    }     
}

function chamaViaCallback(callback, msg){
  callback(msg);
}

var test_objeto = new TestOne(); // instancia o objeto

chamaViaCallback( test_objeto.metodoPrincipal.bind(test_objeto), 'Foo' );
chamaViaCallback( msg => test_objeto.metodoPrincipal(msg), 'Bar' );
chamaViaCallback( () => { test_objeto.metodoPrincipal('Baz'); } );

2
  • 2
    Obs: não precisa apenas da flecha de função para fazer a segunda alternativa, mas gostei da ideia de wrap com arrows
    – user37626
    Commented 12/10/2016 às 11:10
  • 1
    @stderr, muito obrigado pela ajuda. Funcionou certinho (+1) Commented 13/10/2016 às 13:02
2

Quando você passa test_objeto.metodoPrincipal para o callback a função do objeto é chamada, porém ele não conseguirá chamar a função metodoSecundario pois você não passou o objeto, e sim apenas a função.

Logo, o objeto (a variável this) não é definido.

Uma solução é passar objeto e o nome da função (como uma string) como callback.

Exemplo, seguindo o seu código:

function chamaMetodoViaCallback(obj, method, msg){
    obj[method](msg);
}

chamaMetodoViaCallback(test_objeto, "metodoPrincipal", 'método secundário chamado via callback!');
1
  • obrigado pela ajuda. Funcionou certinho aqui. Porém, no meu caso, será mais viável passar como objeto mesmo. A resposta do stderr se adequou melhor à minha situação. (+1 para vc) Commented 13/10/2016 às 13:07
2

Como fazer para chamar via callback, um método de uma classe, sendo que este método utiliza outros métodos?

Se você pretende referenciar test_objeto.metodoPrincipal sem passar test_objeto para chamaViaCallback, use o método Function#bind(instância, argumentos):

test_objeto.metodoPrincipal.bind(test_objeto)

Function#bind retorna a mesma função, coberta por instância e argumentos pré-definidos.

1
  • 1
    obrigado pela ajuda! Funcionou certo aqui. (+1 para você.) Commented 13/10/2016 às 13:11

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 .