Pase una función de JavaScript como parámetro


Answers

Si desea pasar una función, simplemente haga referencia por su nombre sin los paréntesis:

function foo(x) {
    alert(x);
}
function bar(func) {
    func("Hello World!");
}

//alerts "Hello World!"
bar(foo);

Pero a veces es posible que desee pasar una función con argumentos incluidos , pero no hacer que se invoque hasta que se invoque la devolución de llamada. Para hacer esto, cuando lo llame, simplemente envuélvalo en una función anónima, como esta:

function foo(x) {
   alert(x);
}
function bar(func) {
   func();
}

//alerts "Hello World!" (from within bar AFTER being passed)
bar(function(){ foo("Hello World!") });

Si lo prefiere, también puede usar la función apply y tener un tercer parámetro que es una matriz de argumentos, como por ejemplo:

function eat(food1, food2)
{
    alert("I like to eat " + food1 + " and " + food2 );
}
function myFunc(callback, args)
{
    //do stuff
    //...
    //execute callback when finished
    callback.apply(this, args);
}

//alerts "I like to eat pickles and peanut butter"
myFunc(eat, ["pickles", "peanut butter"]); 
Question

¿Cómo paso una función como parámetro sin la función que se ejecuta en la función "principal" o usando eval() ? (Desde que leí que es inseguro)

Tengo esto:

addContact(entityId, refreshContactList());

Funciona, pero el problema es que refreshContactList se refreshContactList cuando se llama a la función, en lugar de cuando se utiliza en la función.

Podría eval() usando eval() , pero no es la mejor práctica, de acuerdo con lo que he leído. ¿Cómo puedo pasar una función como parámetro en JavaScript?




Para pasar la función como parámetro, ¡simplemente elimine los corchetes!

function ToBeCalled(){
  alert("I was called");
}

function iNeedParameter( paramFunc) {
   //it is a good idea to check if the parameter is actually not null
   //and that it is a function
   if (paramFunc && (typeof paramFunc == "function")) {
      paramFunc();   
   }
}

//this calls iNeedParameter and sends the other function to it
iNeedParameter(ToBeCalled); 

La idea detrás de esto es que una función es bastante similar a una variable. En lugar de escribir

function ToBeCalled() { /* something */ }

también podrías escribir

var ToBeCalledVariable = function () { /* something */ }

Hay pequeñas diferencias entre los dos, pero de todos modos, ambos son formas válidas para definir una función. Ahora, si defines una función y la asignas explícitamente a una variable, parece bastante lógico, puedes pasarla como parámetro a otra función, y no necesitas paréntesis:

anotherFunction(ToBeCalledVariable);



De hecho, parece un poco complicado, no lo es.

obtener el método como un parámetro:

 function JS_method(_callBack) { 

           _callBack("called");  

        }

Puede dar como un método de parámetro:

    JS_method(function (d) {
           //Finally this will work.
           alert(d)
    });



En algún momento cuando necesite tratar con el manejador de eventos, así que también debe pasar el evento como argumento, la mayoría de la biblioteca moderna como reaccionar, angular puede necesitar esto.

Necesito anular la función OnSubmit (función de la biblioteca de terceros) con alguna validación personalizada en reactjs y pasé la función y el evento tanto como a continuación

ORIGINALMENTE

    <button className="img-submit" type="button"  onClick=
 {onSubmit}>Upload Image</button>

HIZO UNA NUEVA FUNCIÓN upload y llamado pasado en onSubmit y evento como argumentos

<button className="img-submit" type="button"  onClick={this.upload.bind(this,event,onSubmit)}>Upload Image</button>

upload(event,fn){
  //custom codes are done here
  fn(event);
}



Me corté todo el pelo con ese problema. No pude hacer que los ejemplos anteriores funcionen, así que terminé como:

function foo(blabla){
    var func = new Function(blabla);
    func();
}
// to call it, I just pass the js function I wanted as a string in the new one...
foo("alert('test')");

Y eso funciona como un encanto ... para lo que necesitaba al menos. Espero que pueda ayudar a algunos.




Sugiero poner los parámetros en una matriz y luego dividirlos usando la función .apply() . Entonces ahora podemos pasar fácilmente una función con muchos parámetros y ejecutarla de una manera simple.

function addContact(parameters, refreshCallback) {
    refreshCallback.apply(this, parameters);
}

function refreshContactList(int, int, string) {
    alert(int + int);
    console.log(string);
}

addContact([1,2,"str"], refreshContactList); //parameters should be putted in an array



Links