Js-Rückgabewertproblem

Ich habe heute im Internet einen Artikel über den Rückgabewert von JS-Funktionen gesehen. Darin gibt es einige Schwierigkeiten mit JS-Funktionen. Ich habe oben das Problem der Rückgabe einer anderen Funktion durch die js-Funktion erwähnt und eine Interviewfrage angehängt.

[javascript] view plain copy
var add = function(x){  
    var sum = 1;  
    var tmp = function(x){  
        sum = sum + x;  
    return tmp;  
    }  
    tmp.toString = function(){  
        return sum;  
    }  
    return tmp;  
} // alert(add(1)(2)(3)) --> 6

Als nächstes erklären wir im Detail, wie eine andere Funktion zurückgegeben wird .

Als ich diesen Artikel zum ersten Mal sah, wusste ich nicht viel über die Rückgabe einer anderen Funktion. Der Grund, warum ich diesen Artikel geschrieben habe, ist, dass er ein wenig verwirrend ist. Ich finde es seltsam, dass der letzte Aufruf

[javascript] view plain copy

add(1)(2)(3)

Da ich in Java bin, habe ich Ich habe noch nie eine solche Funktionsaufrufmethode gesehen, daher habe ich beschlossen, sie zu recherchieren. Wenn Sie bereits ein tiefes Verständnis davon haben, können Sie sie natürlich überspringen Hinweise geben und lächeln, wenn es Mängel gibt. Okay, kommen wir ohne weitere Umschweife zum Punkt.

Sehen wir uns das einfachste Beispiel an:

[javascript] view plain copy
function create1(pro) {  
    console.log("pro : " + pro);  
    return function(obj1, obj2){  
        console.log(obj1 + " -- " + obj2);  
        return obj1 + obj2;  
    }  
}

Ich habe eine einfache Funktion create1 erstellt, und es gibt einen Rückgabewert, der Rückgabewert ist eine interne Funktion. Nachdem die Funktion erstellt wurde, rufen wir sie als nächstes auf:

[javascript] view plain copy
var c1 = create1("pro"); // 创建函数

Nach meinem bisherigen Verständnis sollte beim Aufrufen dieser Methode pro: pro gedruckt werden, und dann wird ein Fehler gemeldet. Wenn Sie nach dem Lesen die gleichen Gedanken haben wie ich, dann herzlichen Glückwunsch, dass Sie zu viel nachgedacht haben oder eine feste Denkweise haben. Lächeln

. Was wahr ist, ist, dass, wenn wir es über den obigen Code aufrufen, das Protokoll pro : pro ausgibt, aber kein Fehler gemeldet wird, und nachdem wir es wiederholt aufgerufen haben, drucken wir einfach das gleiche Protokoll hin und her. Dies bedeutet auch, dass zu diesem Zeitpunkt nur die Methode create1 () und nicht die interne Funktion der Funktion eingegeben wurde. Inspiriert durch die Interviewfragen versuchte ich es einmal anzurufen und stellte fest, dass die nachfolgenden Ergebnisse gedruckt wurden.

[java] view plain copy
c1(1, 2); // 调用函数

Auf diese Weise wird das folgende Protokoll gedruckt. Dies zeigt, dass wir beim ersten Aufruf der Methode nicht tatsächlich die innere Funktion eingegeben haben, sondern nur den äußeren Funktionskörper Können wir erneut den inneren Funktionskörper betreten? Wenn wir zu diesem Zeitpunkt den obigen Aufruf wiederholen, wird nur der innere Funktionskörper aufgerufen, und es gibt keinen äußeren Funktionskörper.

Eine solche Funktion gibt nur einen äußeren Funktionskörper zurück. Nur nachfolgende Aufrufe können den inneren Funktionskörper aufrufen Körper.

Keine Sorge, es ist noch nicht vorbei, es wird noch mehr kommen...

Als nächstes schauen wir uns eine andere Situation an. Wir deklarieren zunächst eine Funktion zum Hinzufügen:

[javascript] view plain copy
function infun(obj1, obj2) {  
    console.log(obj1 + " -- " + obj2);  
        return obj1 + obj2;  
}  
然后再声明一个函数，在该函数中调用上面声明的函数：
[javascript] view plain copy
function create2(pro) {  
    console.log("pro = " + pro);  
        return infun(obj1, obj2); // 这个时候,会报错  
}

Zum Schluss rufen Sie an:

[javascript] view plain copy
var c1 = create2("pro");

Sehen Sie sich das Protokoll an:

pro = pro
‌Uncaught ReferenceError: obj1 is not defined

Sie werden feststellen, dass nach dem Drucken eines Protokolls eine Ausnahme ausgelöst wird. Nehmen Sie einige Änderungen an der Methode vor. Es wird festgestellt, dass

[javascript] view plain copy
function create2(pro) {  
    console.log("pro = " + pro);  
    var obj1 = 1, obj2 = 2;  
    return infun(obj1, obj2); // 这个时候,会报错  
}

beim Aufruf normal ausgeführt wird, und es werden zwei Protokolldatensätze gedruckt.

Dies zeigt, dass die Rückgabe einer deklarierten Funktion innerhalb einer Funktion ähnlich wie hier tatsächlich ein Aufruf der deklarierten Funktion ist, was sich von der obigen Situation unterscheidet.

Okay, schauen Sie jetzt zurück und schauen Sie sich die Interviewfragen am Anfang genauer an, und Sie werden feststellen, dass alles klar ist:

[javascript] view plain copy
// 声明一个函数表达式  
var add = function(x){  
    var sum = 1;  
    // 在函数表达式内部有一个求和的内部函数  
    var tmp = function(x){  
        sum = sum + x;// 求和  
        return tmp;  
    }  
    // 构建一个函数体的toString()函数  
    tmp.toString = function(){  
        return sum;  
    }  
    return tmp; // 返回的是一个函数体,如果该函数体有toString()方法,则会调用函数体的toString()方法  
}

Dann schauen wir uns den Anruf an:

[javascript] view plain copy
alert(add(1)(2)(3))

Das Ergebnis ist 6. Der Grund ist derselbe wie in der ersten Situation, die wir besprochen haben. Als nächstes rufen wir wiederholt auf:

[javascript] view plain copy
// 以下结果输出为：6  
alert(add(10)(2)(3))  
alert(add(100)(2)(3))  
// 下面的结果输出变了  
alert(add(1)(3)(3))  
alert(add(1)(2)(5))

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie diese gelesen haben Fälle, mehr Bitte beachten Sie andere verwandte Artikel auf der chinesischen PHP-Website!

Verwandte Lektüre:

Wie man DIV zur adaptiven Höhe macht

Wie CSS verwenden, um den Textinhalt des Bildhintergrunds auszublenden

So verwenden Sie CSS, um Divs in HTML auszublenden

Das obige ist der detaillierte Inhalt vonJs-Rückgabewertproblem. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!