Passar parâmetros na função setInterval

320

Por favor, informe como passar parâmetros para uma função chamada using setInterval.

Meu exemplo setInterval(funca(10,3), 500);está incorreto.

Rakesh
fonte
2
Sintaxe:.setInterval(func, delay[, param1, param2, ...]);
O-

Respostas:

543

Você precisa criar uma função anônima para que a função real não seja executada imediatamente.

setInterval( function() { funca(10,3); }, 500 );
tvanfosson
fonte
4
qual deve ser o parâmetro dinâmico?
rony36
28
@ rony36 - você provavelmente deseja ter uma função que crie o temporizador de intervalo para você. Passe o parâmetro para a função para que seu valor seja capturado no fechamento da função e retido para quando o cronômetro expirar. function createInterval(f,dynamicParameter,interval) { setInterval(function() { f(dynamicParameter); }, interval); }Em seguida, chame-o como createInterval(funca,dynamicValue,500); Obviamente, você pode estender isso para mais de um parâmetro. E, por favor, use nomes de variáveis ​​mais descritivos. :)
tvanfosson
@tvanfosson: resposta incrível! Você sabe como limpar o formulário do intervalo na função funca?
Flo
@tvanfosson Obrigado. Meu mal, mas eu realmente quis dizer o exemplo createInterval que você deu na seção de comentários. Como isso funcionaria para isso? Eu estava pensando em passar uma variável de timer como um parâmetro dinâmico também, mas não sei como ou se isso faz sentido. Por uma questão de clareza, adicionei uma nova pergunta aqui: stackoverflow.com/questions/40414792/…
Flo
78

agora com ES5, método de ligação Function prototype:

setInterval(funca.bind(null,10,3),500);

Referência aqui

sbr
fonte
2
Esta é a melhor resposta, no entanto, pode ter um comportamento inesperado, dependendo da função. por exemplo console.log.bind(null)("Log me"), jogará Illegal invocation, mas console.log.bind(console)("Log me")funcionará como esperado. Isso ocorre porque console.logrequer consolecomo o thisargumento.
Indy
1
De longe a melhor resposta. Magra e limpa. Muito obrigado!
Tobi
Muito limpo e eficiente!
contactmatt
2
Basta adicionar que funciona com Chrome> = 7, Firefox> = 4.0, Explorer> = 9, Opera> = 11.60, Safari> = 5.1 (Fonte: developer.mozilla.org/ca/docs/Web/JavaScript/Reference/… )
Roger Veciana
60

Inclua-os como parâmetros em setInterval:

setInterval(funca, 500, 10, 3);

A sintaxe na sua pergunta usa eval, o que não é uma prática recomendada.

Kev
fonte
2
O que ?! Desde quando isso foi permitido? (pergunta séria)
Crescent Fresh
1
Não tenho certeza. Minha fonte foi: developer.mozilla.org/en/DOM/window.setInterval
Kev
2
@Kev Internet Explorer é uma verdadeira bagunça Ele não suporta a passagem de argumentos -.-
ShrekOverflow
1
IMHO esta deve ser a resposta aceita. Solução agradável, simples e limpa.
LightMan
32

Você pode passar o (s) parâmetro (s) como uma propriedade do objeto de função, não como um parâmetro:

var f = this.someFunction;  //use 'this' if called from class
f.parameter1 = obj;
f.parameter2 = this;
f.parameter3 = whatever;
setInterval(f, 1000);

Então, na sua função someFunction, você terá acesso aos parâmetros. Isso é particularmente útil nas classes em que o escopo vai automaticamente para o espaço global e você perde referências à classe que chamou setInterval para começar. Com essa abordagem, "parameter2" em "someFunction", no exemplo acima, terá o escopo correto.

Juan
fonte
1
Você pode acessar por
Classname.prototype.someFunction.parameter1
2
A adição de parâmetros a um objeto ou função pode fazer com que o compilador fique mais lento, pois precisará reconstruir sua representação de código nativo do objeto (por exemplo, se isso foi feito em um hot loop), portanto, tenha cuidado.
mattdlockyer
23
     setInterval(function(a,b,c){

          console.log(a + b +c);  

      }, 500, 1,2,3);

           //note the console will  print 6
          //here we are passing 1,2,3 for a,b,c arguments
         // tested in node v 8.11 and chrome 69
manas
fonte
Melhor resposta explicada.
precisa saber é o seguinte
Então, por que passar os argumentos como matrizes? Esse detalhe nem se refere à questão.
user4642212
18

Você pode usar uma função anônima;

setInterval(function() { funca(10,3); },500);
Simon
fonte
1
Esta é uma ligação bastante cara!
Roy Lee
2
@Roylee Como é caro?
user4642212
18
setInterval(function,milliseconds,param1,param2,...)

Atualização: 2018 - use o operador "spread"

function repeater(param1, param2, param3){
   alert(param1);
   alert(param2);
   alert(param3); 
}

let input = [1,2,3];
setInterval(repeater,3000,...input);

swogger
fonte
Assim é bem melhor.
Ugur Kazdal
Assim é bem melhor.
Ugur Kazdal
11

De longe, a resposta mais prática é a dada por tvanfosson, tudo o que posso fazer é fornecer uma versão atualizada com o ES6:

setInterval( ()=>{ funca(10,3); }, 500);
A.rodriguez
fonte
1
Você está dizendo que () => {} é a nova maneira do ES6 de substituir a função () {}? Interessante. Primeiro, pensei que os foguetes eram ultrapassados. E, a menos que essa sintaxe tenha outros usos comuns, é muito, muito estranho. Eu vejo que eles são "flechas gordas". Ainda assim, estranho. Eu acho que alguém gosta e é uma questão de opinião.
Richard_G
6

Citar os argumentos deve ser suficiente:

OK --> reloadIntervalID = window.setInterval( "reloadSeries('"+param2Pass+"')" , 5000)

KO --> reloadIntervalID = window.setInterval( "reloadSeries( "+param2Pass+" )" , 5000)

Observe a aspas simples 'para cada argumento.

Testado com IE8, Chrome e FireFox

waterazu
fonte
7
Usar eval é uma prática terrível. O uso da função anônima é muito melhor.
23713 SuperIRis
1

Eu sei que este tópico é tão antigo, mas aqui está minha solução sobre a passagem de parâmetros na setIntervalfunção.

Html:

var fiveMinutes = 60 * 2;
var display = document.querySelector('#timer');
startTimer(fiveMinutes, display);

JavaScript:

function startTimer(duration, display) {
    var timer = duration,
        minutes, seconds;

    setInterval(function () {
        minutes = parseInt(timer / 60, 10);
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;
        --timer; // put boolean value for minus values.

    }, 1000);
}
Kaan Karaca
fonte
Eu preciso acessar um valor uma vez ao chamar a função, mas não a cada segundo, então sua resposta fornece isso (por exemplo timer), mas como você faz clearInterval()nesse cenário?
user1063287
0

Isso funciona setInterval("foo(bar)",int,lang);... Jon Kleiser me levou à resposta.

Stephen
fonte
0

Outra solução consiste em passar sua função assim (se você tiver vars dinâmicos): setInterval ('funca (' + x + ',' + y + ')', 500);

nonozor
fonte
0

Você pode usar uma biblioteca chamada sublinhado js. Ele fornece um bom invólucro no método bind e também é uma sintaxe muito mais limpa. Permitindo que você execute a função no escopo especificado.

http://underscorejs.org/#bind

_.bind (função, escopo, * argumentos)

Sagar Parikh
fonte
0

Esse problema seria uma boa demonstração para o uso de fechamentos. A ideia é que uma função use uma variável de escopo externo. Aqui está um exemplo...

setInterval(makeClosure("Snowden"), 1000)

function makeClosure(name) {
var ret

ret = function(){
    console.log("Hello, " + name);
}

return ret;
}

A função "makeClosure" retorna outra função, que tem acesso à variável de escopo externo "name". Então, basicamente, você precisa passar as variáveis ​​para a função "makeClosure" e usá-las na função atribuída à variável "ret". Afetivamente, setInterval executará a função atribuída a "ret".

Aleksey Kanaev
fonte
0

Eu tive o mesmo problema com o aplicativo Vue. No meu caso, esta solução só funciona se a função anônima tiver declarado como função de seta, em relação à declaração no mounted ()gancho do círculo da vida.

Srdjan Milic
fonte