vor langer Zeit, ich sah, wie jemand ihren gesamten JavaScript-Block mit Code so etwas wie der folgenden Code kapseln:Encapsulation in JavaScript
(function() {
// ...
})(this);
Fragen:
Ja, das ist richtig. Es heißt ein selbstaufrufender anonymer Funktionsausdruck.
JavaScript-Variablen haben entweder einen Funktionsumfang oder einen globalen Bereich. Es gibt keinen Blockbereich. Wenn Sie Ihren Code in eine selbstaufrufende Funktion wie die in Ihrem Beispiel einfügen, wird ein temporärer lokaler Bereich für den einmaligen, sofort ablaufenden Code erstellt, ohne den globalen Namespace zu verschmutzen.
Beachten Sie Folgendes:
<html>
<body>
...
<script>
(function() {
var x = '';
function myFunction() {
alert('Hello: ' + x);
}
x = 'Bob';
myFunction();
alert(typeof x); // string
alert(typeof myFunction); // function
})();
alert(typeof x); // undefined
alert(typeof myFunction); // undefined
</script>
<script src="other-javascript.js"></script>
</body>
</html>
Was auch immer Sie in diesem Selbst rufenden Funktion deklarieren wird in einem separaten Rahmen gehalten. Auf die Variable x und die Funktion myFunction() kann nirgendwo anders zugegriffen werden. Der Code in other-javascript.js wird sie zum Beispiel nicht sehen, und es wäre kostenlos, eine andere Funktion myFunction() ohne Konflikte zu deklarieren.
Also ist "Block" Bereich wie eine private Variable? – nickb
@ user434493: Im Gegensatz zu C, C++, Java und anderen Sprachen ist die Variable 'y' in 'if (x> 5) {var y = 0; } 'kann von außerhalb des' if'-Blocks aufgerufen werden ...Das wäre der Block-Bereich gewesen, aber JavaScript-Variablen werden in einer Funktionsumgebung gespeichert und nicht von anderen '{}' - Blöcken beeinflusst. Lassen Sie mich meine Antwort mit einem Beispiel aktualisieren ... –
Wie würden Sie eine Variable von außerhalb der Kapselung auf ein Objekt innerhalb der Kapselung setzen? – user3015682
auch zusätzlich zu der Antwort des @ Daniel, this an die Funktion übergeben ist ein gemeinsames Muster, das eine Referenz auf das globale Objekt zu haben, zum Beispiel:
(function(window){
})(this);
In Browser, um das globale Objekts Scripting hat eine Eigenschaft namens window bezieht sich auf das globale Objekt selbst, in anderen Umgebungen gibt es keine window Eigenschaft.
Auch eine andere Sache, die getan werden kann, ist ein Argument angeben namens undefined, weil die undefined Eigenschaft nicht auf dem 3. ECMAScript beschrieben. Ausgabe Standard (es gibt keine Garantie, dass oder nicht vorhanden ist), und in einigen Implementierungen die Eigenschaft ist wandelbar, zum Beispiel:
(function(window, undefined){
})(this);
Im obigen Beispiel haben wir zwei lokale Kennungen (was ein wenig schneller zu lösen), window und undefined, nur die erste wird übergeben (this, die bezieht sich immer auf das globale Objekt in Globaler Code (Code, der außerhalb jeder Funktion ist)), und der zweite, wird das primitive undefined Wert enthalten weil wir ihm keinen Wert geben. Dieses Muster wird von einigen Bibliotheken wie jQuery verwendet.
Ich denke, 'verkapseln' ist hier ein irreführender Begriff und sollte in Bezug auf OOP-Konzepte in 'Geltungsbereich' geändert werden –