Frage Was bewirkt das Ausrufezeichen vor der Funktion?


!function () {}();

1020
2017-09-20 21:21


Ursprung


Antworten:


JavaScript-Syntax 101. Hier ist ein Funktionsdeklaration:

function foo() {}

Beachten Sie, dass es kein Semikolon gibt: das ist nur eine Funktion Erklärung. Du brauchst eine Invokation, foo(), um die Funktion tatsächlich auszuführen.

Jetzt, wenn wir das scheinbar harmlose Ausrufezeichen hinzufügen: !function foo() {} es verwandelt es in ein Ausdruck. Es ist jetzt ein Funktionsausdruck.

Das ! allein ruft die Funktion natürlich nicht auf, aber wir können jetzt setzen () Am Ende: !function foo() {}() welches höhere Priorität hat als ! und ruft sofort die Funktion auf.

Also, was der Autor macht, speichert ein Byte pro Funktionsausdruck; Eine besser lesbare Schreibweise wäre das:

(function(){})();

Zuletzt, ! macht den Ausdruck wahr. Dies liegt daran, dass standardmäßig alle IIFE zurückkehren undefined, die uns verlassen !undefined welches ist true. Nicht besonders nützlich.


1737
2018-04-13 20:02



Die Funktion:

function () {}

gibt nichts (oder undefiniert) zurück.

Manchmal möchten wir eine Funktion genau so nennen, wie wir sie erstellt haben. Sie könnten versucht sein, dies zu versuchen:

function () {}()

aber es ergibt sich a SyntaxError.

Verwendung der ! Operator vor der Funktion bewirkt, dass es als Ausdruck behandelt wird, also können wir es nennen:

!function () {}()

Dadurch wird in diesem Fall auch das boolesche Gegenteil des Rückgabewerts der Funktion zurückgegeben true, weil !undefined ist true. Wenn Sie möchten, dass der tatsächliche Rückgabewert das Ergebnis des Aufrufs ist, versuchen Sie es folgendermaßen:

(function () {})()

327
2017-09-20 21:28



Es gibt einen guten Punkt für die Verwendung ! für Funktionsaufruf markiert am Airbnb JavaScript Anleitung

Allgemein Idee für die Verwendung dieser Technik auf separaten Dateien (aka Module), die später verkettet werden. Vorbehalt hier ist, dass Dateien von Werkzeugen verkettet werden sollen, die neue Datei auf neue Zeile setzen (was ohnehin häufig für die meisten concat-Tools ist). In diesem Fall mit ! wird helfen, Fehler zu vermeiden, wenn das vorher verkettete Modul hinteres Semikolon verpasst hat, und dennoch gibt es Flexibilität, um sie in beliebiger Reihenfolge ohne Sorgen zu platzieren.

!function abc(){}()
!function bca(){}();

Wird gleich funktionieren wie

!function abc(){}()
;(function bca(){})();

aber spart zwei Zeichen und willkürlich sieht besser aus.

Und nebenbei +,-,~,void Operatoren haben denselben Effekt hinsichtlich der Aufruffunktion, denn wenn Sie etwas verwenden, um von dieser Funktion zurückzukehren, würden sie sich anders verhalten.

abcval = !function abc(){return true;}() // abcval equals false
bcaval = +function bca(){return true;}() // bcaval equals 1
zyxval = -function zyx(){return true;}() // zyxval equals -1
xyzval = ~function xyz(){return true;}() // your guess?

Wenn Sie jedoch IIFE-Muster für eine Datei verwenden, müssen Sie eine Modulcodetrennung verwenden und das concat-Tool für die Optimierung verwenden (was eine Zeile zu einem Dateijob macht), als die Konstruktion

!function abc(/*no returns*/) {}()
+function bca() {/*no returns*/}()

Führt eine sichere Codeausführung durch, genau wie ein erstes Codebeispiel.

Dieser wird Fehler verursachen, weil JavaScript ASI nicht in der Lage ist, seine Arbeit zu machen.

!function abc(/*no returns*/) {}()
(function bca() {/*no returns*/})()

Eine Anmerkung zu unären Operatoren, sie würden ähnliche Arbeiten machen, aber nur für den Fall, dass sie nicht im ersten Modul verwendet werden. Sie sind also nicht so sicher, wenn Sie nicht die vollständige Kontrolle über die Verkettungsreihenfolge haben.

Das funktioniert:

!function abc(/*no returns*/) {}()
^function bca() {/*no returns*/}()

Dies nicht:

^function abc(/*no returns*/) {}()
!function bca() {/*no returns*/}()

46
2017-10-01 18:10



Es gibt zurück, ob die Anweisung als false ausgewertet werden kann. z.B:

!false      // true
!true       // false
!isValid()  // is not valid

Sie können es zweimal verwenden, um einen Wert für boolean zu erzwingen:

!!1    // true
!!0    // false

Also, um deine Frage direkter zu beantworten:

var myVar = !function(){ return false; }();  // myVar contains true

Bearbeiten: Es hat den Nebeneffekt, die Funktionsdeklaration in einen Funktionsausdruck zu ändern. Z.B. Der folgende Code ist nicht gültig, da er als Funktionsdeklaration interpretiert wird, bei der die erforderliche Angabe fehlt Kennung (oder Funktionsname):

function () { return false; }();  // syntax error

26
2017-09-20 21:25



Und hier ist noch etwas, was ich aus der Konsole herausgefunden habe. Wie bereits erwähnt, bewirkt das Ausrufezeichen, dass die Funktion einen booleschen Wert zurückgibt.

Für die letztere der Syntax:

( function my_function() {} )()

Wir können etwas tun wie:

(function add_them(a,b) { return a+b;} )(9,4)

Wie eine simultane Funktionsdefinition und Aufruf.

Bearbeiten:
Jetzt würden Sie fragen, was '!' Funktionsdefinition eingeben. Betrachten wir folgendes:

!function a_would_be_function() { alert("Do some junk but inside a function"); }()

Sie möchten eine Funktion wie oben ausführen, aber ohne '!' würde einen Fehler erzeugen. Hoffe ich bin klar.


5
2018-05-06 14:49



! ist logisch NICHT Operator, es ist ein boolescher Operator, der etwas in sein Gegenteil umkehrt.

Sie können die Klammern der aufgerufenen Funktion zwar umgehen, indem Sie die KNALL (!) vor der Funktion, invertiert es immer noch die Rückgabe, was möglicherweise nicht das ist, was Sie wollten. Wie im Falle eines IEFE würde es zurückkehren nicht definiert, die, wenn sie invertiert wird, der boolesche Wert ist.

Verwenden Sie stattdessen die schließende Klammer und den BANG (!) wenn benötigt.

// I'm going to leave the closing () in all examples as invoking the function with just ! and () takes away from what's happening.

(function(){ return false; }());
=> false

!(function(){ return false; }());
=> true

!!(function(){ return false; }());
=> false

!!!(function(){ return false; }());
=> true

Andere Betreiber, die arbeiten ...

+(function(){ return false; }());
=> 0

-(function(){ return false; }());
=> -0

~(function(){ return false; }());
=> -1

Kombinierte Betreiber ...

+!(function(){ return false; }());
=> 1

-!(function(){ return false; }());
=> -1

!+(function(){ return false; }());
=> true

!-(function(){ return false; }());
=> true

~!(function(){ return false; }());
=> -2

~!!(function(){ return false; }());
=> -1

+~(function(){ return false; }());
+> -1

3
2017-07-31 16:36



Es ist eine andere Art des Schreibens von IIFE (sofort aufgerufener Funktionsausdruck).

Seine andere Art zu schreiben -

(function( args ) {})()

gleich wie

!function ( args ) {}();

2
2018-03-06 09:56



Es ist nur ein Byte von Daten zu speichern, wenn wir Javascript Minification tun.

Betrachten Sie die folgende anonyme Funktion

function (){}

Um das oben genannte als selbstaufrufende Funktion zu machen, werden wir im Allgemeinen den obigen Code als ändern

(function (){}())

Jetzt haben wir zwei zusätzliche Zeichen hinzugefügt (,) abgesehen vom Hinzufügen () am Ende der Funktion, die notwendig ist, um die Funktion aufzurufen. Bei der Minimierung konzentrieren wir uns im Allgemeinen darauf, die Dateigröße zu reduzieren. So können wir auch die obige Funktion als schreiben

!function (){}()

Dennoch sind beide selbstaufrufende Funktionen und wir speichern auch ein Byte. Anstelle von 2 Zeichen (,) wir haben nur einen Charakter benutzt !


2
2017-09-05 10:05



! wird negieren (Gegenteil) was auch immer Sie als Ergebnis erwarten, d. h. wenn Sie haben

var boy = true;
undefined
boy
true
!boy
false

wenn du anrufst boy, wird dein Ergebnis sein true, aber in dem Moment, in dem Sie das hinzufügen ! beim Anrufen boyd !boy, wird dein Ergebnis sein false. Was du mit anderen Worten meinst NotBoy, aber dieses Mal ist es im Grunde auch ein Boolesches Ergebnis true oder false.

Das ist das gleiche, was mit dem passiert !function () {}(); Ausdruck, nur laufen function () {}(); wird Ihnen einen Fehler melden, aber hinzufügen ! direkt vor deinem function () {}(); Ausdruck, macht es zum Gegenteil von der function () {}(); was sollte dich zurückgeben true. Beispiel kann unten gesehen werden:

function () {}();
SyntaxError: function statement requires a name
!function () {}();
true

1
2018-01-13 15:55



Lassen Sie uns ein paar andere Bytes speichern!

(() => {})()

Beispiel:

(() => {return "yeah"})()

0
2018-06-23 06:24