Pasar parámetros en la función setInterval

320

Indique cómo pasar parámetros a una función llamada using setInterval.

Mi ejemplo setInterval(funca(10,3), 500);es incorrecto

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

Respuestas:

543

Debe crear una función anónima para que la función real no se ejecute de inmediato.

setInterval( function() { funca(10,3); }, 500 );
tvanfosson
fuente
44
¿Qué debería ser para el parámetro dinámico?
rony36
28
@ rony36: probablemente desee tener una función que cree el temporizador de intervalo para usted. Pase el parámetro a la función para que su valor sea capturado en el cierre de la función y retenido para cuando expire el temporizador. function createInterval(f,dynamicParameter,interval) { setInterval(function() { f(dynamicParameter); }, interval); }Luego llámelo como createInterval(funca,dynamicValue,500); Obviamente puede extender esto para más de un parámetro. Y, por favor, use nombres de variables más descriptivos. :)
tvanfosson
@tvanfosson: ¡respuesta increíble! ¿Sabes cómo borrar la forma de intervalo dentro de la función funca?
Flo
@tvanfosson Gracias. Lo malo, pero en realidad me refería al ejemplo createInterval que diste en la sección de comentarios. ¿Cómo funcionaría para eso? Estaba pensando en pasar una variable de temporizador como un parámetro dinámico también, pero no estoy seguro de cómo o si eso tiene sentido. En aras de la claridad, agregué una nueva pregunta aquí: stackoverflow.com/questions/40414792/…
Flo
78

ahora con ES5, método de enlace Prototipo de función:

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

Referencia aquí

sbr
fuente
2
Esta es la mejor respuesta, sin embargo, puede tener un comportamiento inesperado dependiendo de la función. por ejemplo console.log.bind(null)("Log me"), lanzará Illegal invocation, pero console.log.bind(console)("Log me")funcionará como se esperaba. Esto es porque console.logrequiere consolecomo el thisargumento.
Indy
1
Con mucho, la mejor respuesta. Delgado y limpio. ¡Muchas gracias!
Tobi
Muy limpio y eficiente!
contactmatt
2
Solo agregue que funciona con Chrome> = 7, Firefox> = 4.0, Explorer> = 9, Opera> = 11.60, Safari> = 5.1 (Fuente: developer.mozilla.org/ca/docs/Web/JavaScript/Reference/… )
Roger Veciana
60

Añádalos como parámetros para setInterval:

setInterval(funca, 500, 10, 3);

La sintaxis en su pregunta usa eval, que no es una práctica recomendada.

Kev
fuente
2
¿Qué? ¿Desde cuándo se permitió eso? (pregunta seria)
Crescent Fresh
1
No estoy seguro. Mi fuente fue: developer.mozilla.org/en/DOM/window.setInterval
Kev el
2
@Kev Internet Explorer es un verdadero desastre No admite argumentos de paso -.-
ShrekOverflow
1
En mi humilde opinión, esta debería ser la respuesta aceptada. Solución agradable, simple y limpia.
LightMan
32

Puede pasar los parámetros como una propiedad del objeto de función, no como un parámetro:

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

Luego, en su función someFunction, tendrá acceso a los parámetros. Esto es particularmente útil dentro de las clases donde el alcance va al espacio global automáticamente y, para empezar, pierde referencias a la clase que llamó a setInterval. Con este enfoque, "parámetro2" en "algunaFunción", en el ejemplo anterior, tendrá el alcance correcto.

Juan
fuente
1
Puede acceder por Classname.prototype.someFunction.parameter1
JoaquinG
2
Agregar parámetros a un objeto o función puede hacer que el compilador se ralentice, ya que tendrá que reconstruir su representación de código nativo del objeto (por ejemplo, si esto se hizo en un bucle dinámico), así que tenga 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
fuente
La mejor respuesta explicada.
Drk_alien
Entonces, ¿por qué pasar los argumentos como matrices? Este detalle ni siquiera se relaciona con la pregunta.
user4642212
18

Puedes usar una función anónima;

setInterval(function() { funca(10,3); },500);
Simón
fuente
1
esta es una llamada bastante cara!
Roy Lee
2
@Roylee ¿Cómo es caro?
user4642212
18
setInterval(function,milliseconds,param1,param2,...)

Actualización: 2018 - use el operador "spread"

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

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

swogger
fuente
Esto es mucho mejor
Ugur Kazdal
Esto es mucho mejor
Ugur Kazdal
11

Con mucho, la respuesta más práctica es la que da tvanfosson, todo lo que puedo hacer es darle una versión actualizada con ES6:

setInterval( ()=>{ funca(10,3); }, 500);
A.rodriguez
fuente
1
¿Está diciendo que () => {} es la nueva forma de reemplazar la función () {} de ES6? Interesante. Primero, pensé que los cohetes eran passe. Y, a menos que esta sintaxis tenga otros usos comunes, es muy, muy extraño. Veo que son "flechas gordas". Aún así, extraño. Supongo que a alguien le gusta y es una cuestión de opinión.
Richard_G
6

Citar los argumentos debería ser suficiente:

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

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

Tenga en cuenta la comilla simple 'para cada argumento.

Probado con IE8, Chrome y Firefox

Waterazu
fuente
77
Usar eval es una práctica terrible. El uso de la función anónima es mucho mejor.
SuperIRis
1

Sé que este tema es muy antiguo, pero aquí está mi solución sobre pasar parámetros en setIntervalfunción.

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
fuente
Necesito acceder a un valor una vez cuando llamo a la función, pero no cada segundo, por lo que su respuesta proporciona esto, (por ejemplo timer), pero ¿cómo lo hace clearInterval()en este escenario?
user1063287
0

Esto funciona setInterval("foo(bar)",int,lang);... Jon Kleiser me llevó a la respuesta.

Stephen
fuente
0

Otra solución consiste en pasar su función así (si tiene variables dinámicas): setInterval ('funca (' + x + ',' + y + ')', 500);

nonozor
fuente
0

Puede usar una biblioteca llamada subrayado js. Da un buen envoltorio sobre el método de enlace y también es una sintaxis mucho más limpia. Permitiéndole ejecutar la función en el alcance especificado.

http://underscorejs.org/#bind

_.bind (función, alcance, * argumentos)

Sagar Parikh
fuente
0

Ese problema sería una buena demostración del uso de cierres. La idea es que una función use una variable de alcance externo. Aquí hay un ejemplo...

setInterval(makeClosure("Snowden"), 1000)

function makeClosure(name) {
var ret

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

return ret;
}

La función "makeClosure" devuelve otra función, que tiene acceso a la variable de ámbito externo "nombre". Entonces, básicamente, necesita pasar cualquier variable a la función "makeClosure" y usarla en la función asignada a la variable "ret". Afectivamente, setInterval ejecutará la función asignada a "ret".

Aleksey Kanaev
fuente
0

He tenido el mismo problema con la aplicación Vue. En mi caso, esta solución solo funciona si la función anónima se ha declarado como función de flecha, con respecto a la declaración en el mounted ()gancho del círculo de vida.

Srdjan Milic
fuente