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.


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 );

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


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.


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.


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

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);

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);


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);

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


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);
}

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.


0

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


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)


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".


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.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.