Übergeben Sie eine JavaScript-Funktion als Parameter

Wie übergebe ich eine Funktion als Parameter, ohne dass die Funktion in der "übergeordneten" Funktion ausgeführt wird oder verwendet wird eval()? (Da ich gelesen habe, dass es unsicher ist.)

Ich habe das:

addContact(entityId, refreshContactList());

Es funktioniert, aber das Problem ist, dass es refreshContactListausgelöst wird, wenn die Funktion aufgerufen wird, anstatt wenn sie in der Funktion verwendet wird.

Ich könnte es mit umgehen eval(), aber es ist nicht die beste Vorgehensweise, so wie ich es gelesen habe. Wie kann ich eine Funktion als Parameter in JavaScript übergeben?

Sie müssen nur die Klammern entfernen:

addContact(entityId, refreshContactList);

Dies übergibt dann die Funktion, ohne sie zuerst auszuführen.

Hier ist ein Beispiel:

function addContact(id, refreshCallback) {
    refreshCallback();
    // You can also pass arguments if you need to
    // refreshCallback(id);
}

function refreshContactList() {
    alert('Hello World');
}

addContact(1, refreshContactList);

Wenn Sie eine Funktion übergeben möchten, referenzieren Sie sie einfach mit Namen ohne Klammern:

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

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

Manchmal möchten Sie jedoch möglicherweise eine Funktion mit enthaltenen Argumenten übergeben , diese jedoch erst aufrufen, wenn der Rückruf aufgerufen wird. Um dies zu tun, verpacken Sie es beim Aufrufen einfach in eine anonyme Funktion wie folgt:

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

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

Wenn Sie möchten, können Sie auch die Apply- Funktion verwenden und einen dritten Parameter haben, der ein Array der Argumente ist, wie z.

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

Beispiel 1:

funct("z", function (x) { return x; });

function funct(a, foo){
    foo(a) // this will return a
}

Beispiel 2:

function foodemo(value){
    return 'hello '+value;
}

function funct(a, foo){
    alert(foo(a));
}

//call funct    
funct('world!',foodemo); //=> 'hello world!'

Schau dir das an

Um die Funktion als Parameter zu übergeben, entfernen Sie einfach die Klammern!

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

Die Idee dahinter ist, dass eine Funktion einer Variablen ziemlich ähnlich ist. Anstatt zu schreiben

function ToBeCalled() { /* something */ }

du könntest genauso gut schreiben

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

Es gibt jedoch geringfügige Unterschiede zwischen den beiden - beide sind gültige Methoden zum Definieren einer Funktion. Wenn Sie nun eine Funktion definieren und sie explizit einer Variablen zuweisen, erscheint es ziemlich logisch, dass Sie sie als Parameter an eine andere Funktion übergeben können und keine Klammern benötigen:

anotherFunction(ToBeCalledVariable);

Unter JavaScript-Programmierern gibt es einen Satz: "Eval is Evil". Versuchen Sie also, ihn um jeden Preis zu vermeiden!

Neben der Antwort von Steve Fenton können Sie Funktionen auch direkt übergeben.

function addContact(entity, refreshFn) {
    refreshFn();
}

function callAddContact() {
    addContact("entity", function() { DoThis(); });
}

Ich habe mir mit diesem Problem alle Haare abgeschnitten. Ich konnte die obigen Beispiele nicht zum Laufen bringen, also endete ich wie folgt:

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

Und das funktioniert wie ein Zauber ... für das, was ich zumindest brauchte. Hoffe es könnte einigen helfen.

Ich schlage vor, die Parameter in ein Array einzufügen und sie dann mithilfe der .apply()Funktion aufzuteilen . Jetzt können wir eine Funktion mit vielen Parametern einfach übergeben und auf einfache Weise ausführen.

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

Sie können auch eval()das Gleiche tun.

//A function to call
function needToBeCalled(p1, p2)
{
    alert(p1+"="+p2);
}

//A function where needToBeCalled passed as an argument with necessary params
//Here params is comma separated string
function callAnotherFunction(aFunction, params)
{
    eval(aFunction + "("+params+")");
}

//A function Call
callAnotherFunction("needToBeCalled", "10,20");

Das ist es. Ich suchte auch nach dieser Lösung und probierte Lösungen aus, die in anderen Antworten bereitgestellt wurden, bekam sie aber schließlich anhand des obigen Beispiels zum Laufen.

Hier ist ein anderer Ansatz:

function a(first,second)    
{        
return (second)(first);           
}     

a('Hello',function(e){alert(e+ ' world!');}); //=> Hello world     

In der Tat scheint ein bisschen kompliziert, ist nicht.

Methode als Parameter abrufen:

 function JS_method(_callBack) { 

           _callBack("called");  

        }

Sie können als Parametermethode angeben:

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

Die anderen Antworten beschreiben hervorragend, was vor sich geht, aber ein wichtiges "Gotcha" besteht darin, sicherzustellen, dass alles, was Sie durchlaufen, tatsächlich ein Verweis auf eine Funktion ist.

Wenn Sie beispielsweise eine Zeichenfolge anstelle einer Funktion durchlaufen, wird folgende Fehlermeldung angezeigt:

function function1(my_function_parameter){
    my_function_parameter();   
}

function function2(){
 alert('Hello world');   
}

function1(function2); //This will work

function1("function2"); //This breaks!

Siehe JsFiddle

Manchmal, wenn Sie sich mit der Ereignisbehandlungsroutine befassen müssen, also auch das Ereignis als Argument übergeben müssen, benötigen die meisten modernen Bibliotheken wie "Reagieren" und "Winkel" dies möglicherweise.

Ich muss die OnSubmit-Funktion (Funktion aus der Bibliothek eines Drittanbieters) mit einer benutzerdefinierten Validierung für reactjs überschreiben und habe die Funktion und das Ereignis wie unten angegeben übergeben

URSPRÜNGLICH

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

MADE A NEW FUNCTION uploadund aufgerufen übergeben onSubmitund Ereignis als Argumente

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

Sie können auch einen JSON verwenden, um JS-Funktionen zu speichern und zu senden.

Überprüfe das Folgende:

var myJSON = 
{
    "myFunc1" : function (){
        alert("a");
    }, 
    "myFunc2" : function (functionParameter){
        functionParameter();
    }
}



function main(){
    myJSON.myFunc2(myJSON.myFunc1);
}

Dies wird 'a' drucken.

Folgendes hat den gleichen Effekt wie oben:

var myFunc1 = function (){
    alert('a');
}

var myFunc2 = function (functionParameter){
    functionParameter();
}

function main(){
    myFunc2(myFunc1);
}

Welches ist auch der gleiche Effekt mit dem folgenden:

function myFunc1(){
    alert('a');
}


function myFunc2 (functionParameter){
    functionParameter();
}

function main(){
    myFunc2(myFunc1);
}

Und ein Objektparadigma mit Class als Objektprototyp:

function Class(){
    this.myFunc1 =  function(msg){
        alert(msg);
    }

    this.myFunc2 = function(callBackParameter){
        callBackParameter('message');
    }
}


function main(){    
    var myClass = new Class();  
    myClass.myFunc2(myClass.myFunc1);
}