2

Imaginemos o seguinte código:

function FazAlgoTrabalhoso(parametro1, parametro2, parametro3){
//Algo trabalhoso aqui
}

var i;
for(i=0;i<=coisas.length;i++){
  //"coisas" é um array já preenchido
  FazAlgoTrabalhoso(coisas[i].algo1, coisas[i].algo2, coisas[i].algo3);
}

$( "#botao_para_cancelar" ).click(function() {
  //Algo para cancelar...
});
  • Digamos que o array "coisas" tenha 100 posições, logo, o loop for vai rodar 100 vezes, ou seja, fará "algo trabalhoso" 100 vezes.
  • Consideremos também que "FazAlgoTrabalhoso" demora uns 5 segundos para se executar completamente.

Minha dúvida é: Como gerenciar o cancelamento de "FazAlgoTrabalhoso"? Por exemplo, se ele já rodou 50 vezes, como cancelar as execuções subsequentes através de um botão? Não obtive sucesso em minhas tentativas e ele sempre acaba rodando o loop todo....

2
  • if ( condicao ) return 2/03/2017 às 13:20
  • Creio que o problema esteja no loop for. Mesmo que tenha um return dentro da função, o for já "ordenou" as 100 execuções e ele acaba passando... 2/03/2017 às 13:37

3 Respostas 3

2

O seu maior problema é que...

var i;
for(i=0;i<=coisas.length;i++){
  FazAlgoTrabalhoso(coisas[i].algo1, coisas[i].algo2, coisas[i].algo3);
}

...é um processo síncrono, o que significa que o JavaScript não irá parar para verificar se um evento foi disparado, como o clicar de de um botão.

Você precisa converter essa função para operar de modo assíncrono:

function FazAlgoTrabalhosoAsync(x) {
  if (!x) x = 0;

  FazAlgoTrabalhoso(coisas[i].algo1, coisas[i].algo2, coisas[i].algo3);

  if (x < coisas.length) 
      setTimeout(function() {FazAlgoTrabalhosoAsync(x + 1);}, 1);
}

FazAlgoTrabalhosoAsync();

setTimeout() faz com que a função seja chamada no futuro. Nesse meio tempo, eventos podem ser interceptados, e uma flag para interrupção marcada como true:

var tenhoQueParar = false;

$( "#botao_para_cancelar" ).click(function() {
  tenhoQueParar = true;
});

function FazAlgoTrabalhosoAsync(x) {
  if (!x) x = 0;

  FazAlgoTrabalhoso(coisas[i].algo1, coisas[i].algo2, coisas[i].algo3);

  if ((x < coisas.length) && !tenhoQueParar) 
      setTimeout(function() {FazAlgoTrabalhosoAsync(x + 1);}, 1);
}

FazAlgoTrabalhosoAsync();
4
  • Hmm parece que é aí que estou errando... Logo mais, vou testar... Só uma dúvida: Me corrija se eu estiver errado, mas creio que onde você diz "Síncrono" seria "Assíncrono" e vice-versa, não? Pois se minha função fosse assíncrona, ou seja, esperasse o resultado anterior para continuar, creio que ela funcionaria... Me corrija se estou equivocado. Obrigado pela ótima resposta :) 2/03/2017 às 16:10
  • Acredito que os termos estejam corretos, @PedroAntônio - uma função assíncrona está fora de sincronia, ou seja, não espera.
    – OnoSendai
    2/03/2017 às 16:26
  • Sim, @OnoSendai, é que você disse que minha função é síncrona... e a meu ver, ela não está esperando o resultado anterior... 2/03/2017 às 16:32
  • @PedroAntônio Nop, eu disse que o processo é síncrono. Entre o laço fornecido pelo for e as chamadas sequenciais da função FazAlgoTrabalhoso não existe espaço para outros eventos acontecerem. As chamadas sequenciais ocorrem de maneira síncrona, nesse caso.
    – OnoSendai
    2/03/2017 às 16:34
0

Resolvi da seguinte forma:

    function FazAlgoTrabalhoso(parametro1, parametro2, parametro3){
    //Algo trabalhoso aqui

    var timer = window.setInterval(function(){
    var pagina = $$('.page').data('page');
    console.log("Estou na página: "+pagina);
    if(pagina != 'preview'){
        //Rotina de cancelamento...

        console.log('Abortado');
        clearInterval(timer);
    }
 },1000);
}

Ou seja, mudei o escopo. Ao invés de cancelar no clique de um botão, consegui monitorar quando o usuário deixa a página. Nisso, cancelo o processo.

-1

Para sair do loop é so adicionar o break

var cancelar = false;
function FazAlgoTrabalhoso(parametro1, parametro2, parametro3){
//Algo trabalhoso aqui
}

var i;
for(i=0;i<=coisas.length;i++){
  //"coisas" é um array já preenchido
  FazAlgoTrabalhoso(coisas[i].algo1, coisas[i].algo2, coisas[i].algo3);
  if (cancelar){
      break;
  }
}

$( "#botao_para_cancelar" ).click(function() {
  cancelar = true;
});
3
  • Mas no meu caso, a interrupção do loop teria que ser através do clique em um botão - que poderia ocorrer a qualquer momento, ou seja, o loop provavelmente já se percorreu todo.... 2/03/2017 às 13:43
  • Editei a pergunta com o "botão cancelador" 2/03/2017 às 13:44
  • troque a variavel, count = 0; por cancelar = false; aonde quando você der um clique no botão cancelar ele coloque cancelar = true;
    – Paulo
    2/03/2017 às 13:49

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 .