Passer les paramètres dans la fonction setInterval


320

Veuillez indiquer comment passer des paramètres dans une fonction appelée using setInterval.

Mon exemple setInterval(funca(10,3), 500);est incorrect.


2
Syntaxe:.setInterval(func, delay[, param1, param2, ...]);
O-9 9

Réponses:


543

Vous devez créer une fonction anonyme pour que la fonction réelle ne soit pas exécutée immédiatement.

setInterval( function() { funca(10,3); }, 500 );

4
quel devrait être le paramètre dynamique?
rony36

28
@ rony36 - vous voulez probablement avoir une fonction qui crée la minuterie d'intervalle pour vous. Passez le paramètre à la fonction pour que sa valeur soit capturée dans la fermeture de la fonction et conservée lorsque le temporisateur expire. function createInterval(f,dynamicParameter,interval) { setInterval(function() { f(dynamicParameter); }, interval); }Ensuite, appelez-le comme createInterval(funca,dynamicValue,500); vous pouvez évidemment l'étendre pour plus d'un paramètre. Et, s'il vous plaît, utilisez des noms de variables plus descriptifs. :)
tvanfosson

@tvanfosson: réponse géniale! Savez-vous comment effacer la forme d'intervalle dans la fonction funca?
Flo

@tvanfosson Merci. Mon mauvais, mais je voulais en fait l'exemple de createInterval que vous avez donné dans la section commentaire. Comment cela fonctionnerait-il pour cela? Je pensais aussi à passer une variable de temporisation comme paramètre dynamique, mais je ne sais pas comment ni si cela a du sens. Dans un souci de clarté, j'ai ajouté une nouvelle question ici: stackoverflow.com/questions/40414792/…
Flo

78

maintenant avec ES5, méthode de liaison Prototype de fonction:

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

Référence ici


2
C'est la meilleure réponse, mais elle peut avoir un comportement inattendu selon la fonction. par exemple console.log.bind(null)("Log me")va lancer Illegal invocation, mais console.log.bind(console)("Log me")fonctionnera comme prévu. C'est parce que console.logrequiert consolecomme thisargument.
Indy

1
De loin la meilleure réponse. Maigre et propre. Merci beaucoup!
Tobi

Très propre et efficace!
contactmatt

2
Ajoutez simplement cela fonctionne avec Chrome> = 7, Firefox> = 4.0, Explorer> = 9, Opera> = 11.60, Safari> = 5.1 (Source: developer.mozilla.org/ca/docs/Web/JavaScript/Reference/… )
Roger Veciana

60

Ajoutez-les en tant que paramètres à setInterval:

setInterval(funca, 500, 10, 3);

La syntaxe de votre question utilise eval, ce qui n'est pas une pratique recommandée.


2
Whaa?! Depuis quand est-ce autorisé? (question sérieuse)
Crescent Fresh

1
Pas certain. Ma source était: developer.mozilla.org/en/DOM/window.setInterval
Kev

2
@Kev Internet Explorer est un vrai gâchis Il ne prend pas en charge le passage d'arguments -.-
ShrekOverflow

1
À mon humble avis, cela devrait être la réponse acceptée. Solution agréable, simple et propre.
LightMan

32

Vous pouvez passer le (s) paramètre (s) en tant que propriété de l'objet fonction, pas en tant que paramètre:

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

Ensuite, dans votre fonction someFunction, vous aurez accès aux paramètres. Ceci est particulièrement utile dans les classes où la portée va automatiquement à l'espace global et vous perdez les références à la classe qui a appelé setInterval pour commencer. Avec cette approche, "parameter2" dans "someFunction", dans l'exemple ci-dessus, aura la bonne portée.


1
Vous pouvez y accéder par Classname.prototype.someFunction.parameter1
JoaquinG

2
L'ajout de paramètres à un objet ou une fonction peut ralentir le compilateur car il devra reconstruire sa représentation en code natif de l'objet (par exemple, si cela a été fait dans une boucle chaude), alors soyez prudent.
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

Meilleure réponse expliquée.
Drk_alien

Alors pourquoi passer les arguments sous forme de tableaux? Ce détail n'a même pas de rapport avec la question.
user4642212

18

Vous pouvez utiliser une fonction anonyme;

setInterval(function() { funca(10,3); },500);

1
c'est un appel assez cher!
Roy Lee

2
@Roylee Comment cela coûte-t-il?
user4642212

18
setInterval(function,milliseconds,param1,param2,...)

Mise à jour: 2018 - utilisez l'opérateur "spread"

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

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


C'est bien mieux.
Ugur Kazdal

C'est bien mieux.
Ugur Kazdal

11

La réponse de loin la plus pratique est celle donnée par tvanfosson, tout ce que je peux faire est de vous donner une version mise à jour avec ES6:

setInterval( ()=>{ funca(10,3); }, 500);

1
Voulez-vous dire que () => {} est la nouvelle façon d'ES6 de remplacer function () {}? Intéressant. Tout d'abord, je pensais que les roquettes étaient passées. Et, à moins que cette syntaxe n'ait d'autres utilisations communes, c'est juste très, très étrange. Je vois que ce sont des "grosses flèches". Pourtant, bizarre. Je suppose que quelqu'un aime ça et c'est une question d'opinion.
Richard_G

6

Citer les arguments devrait suffire:

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

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

Notez la citation unique 'pour chaque argument.

Testé avec IE8, Chrome et FireFox


7
Utiliser eval est une terrible pratique. L'utilisation de la fonction anonyme est bien meilleure.
SuperIRis

1

Je sais que ce sujet est tellement ancien mais voici ma solution pour passer des paramètres en setIntervalfonction.

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

J'ai besoin d'accéder à une valeur une fois lors de l'appel de la fonction, mais pas à chaque seconde, donc votre réponse le fournit (par exemple timer), mais comment faites-vous clearInterval()dans ce scénario?
user1063287

0

Cela fonctionne setInterval("foo(bar)",int,lang);... Jon Kleiser m'amène à la réponse.


0

Une autre solution consiste à passer votre fonction comme ça (si vous avez des vars dynamiques): setInterval ('funca (' + x + ',' + y + ')', 500);


0

Vous pouvez utiliser une bibliothèque appelée underscore js. Il donne un bon emballage sur la méthode de liaison et est également une syntaxe beaucoup plus propre. Vous permettant d'exécuter la fonction dans la portée spécifiée.

http://underscorejs.org/#bind

_.bind (fonction, portée, * arguments)


0

Ce problème serait une belle démonstration de l'utilisation des fermetures. L'idée est qu'une fonction utilise une variable de portée externe. Voici un exemple...

setInterval(makeClosure("Snowden"), 1000)

function makeClosure(name) {
var ret

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

return ret;
}

La fonction "makeClosure" renvoie une autre fonction, qui a accès à la variable de portée externe "nom". Donc, fondamentalement, vous devez transmettre toutes les variables à la fonction "makeClosure" et les utiliser dans la fonction affectée à la variable "ret". Affectueusement, setInterval exécutera la fonction affectée à "ret".


0

J'ai eu le même problème avec l'application Vue. Dans mon cas, cette solution ne fonctionne que si la fonction anonyme a déclaré comme fonction flèche, en ce qui concerne la déclaration au mounted ()crochet du cercle de vie.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.