Detaillierte Erläuterung alternativer Schreibmethoden von JavaScript_Javascript-Kenntnissen

JavaScript ist eine Skriptsprache für das Internet!

JavaScript wird von Millionen von Webseiten verwendet, um das Design zu verbessern, Formulare zu validieren, Browser zu erkennen, Cookies zu erstellen und mehr.

JavaScript ist die beliebteste Skriptsprache im Internet.

JavaScript ist einfach zu verwenden! Du wirst es lieben!

JavaScript ist eine interpretierte Skriptsprache mit flexibler Syntax, die es verschiedenen Personen ermöglicht, dieselbe Funktion auf viele verschiedene Arten zu schreiben. Wie organisiere ich JavaScript-Code, damit andere auf einen Blick erkennen können, dass Sie nicht einfach sind? Freuen Sie sich wirklich darauf, dass andere nach dem Lesen Ihres Codes ausrufen: „Damit Sie es immer noch so schreiben können“?

N Möglichkeiten, anonyme Funktionen zu schreiben

Die anonyme Funktion von JS ist eine selbstausführende Funktion ohne Angabe eines Funktionsnamens. Das Format ist wie folgt:

(function(){})();

Tatsächlich fügen wir in Projekten oft „;“ voran:

;function(){}();

Aufgrund der Syntax von JS kann das Semikolon weggelassen werden, dieser Mechanismus kann jedoch auch zu unerwarteten Fehlern führen. Um Syntaxfehler zu vermeiden, die durch das Zusammenführen und Komprimieren des Codes in einer Datei entstehen, nachdem er online geschaltet wurde, kann das Hinzufügen von „;“ unbekannte Fehler vermeiden.

Aber manchmal sehen wir anonyme Funktionen, die in den Bibliotheken oder Plug-Ins anderer Leute so geschrieben sind:

+function(){}();

„+“ ist hier der Operator, und der Operator hat eine extrem hohe Priorität, sodass die Funktionsdeklaration rechts plus die Klammern (eigentlich die Art und Weise, wie die Funktion geschrieben wird) direkt ausgeführt werden. Tatsächlich kann ihm nicht nur ein „+“-Zeichen vorangestellt werden, sondern es können auch Operatoren wie „-“, „!“, „~“ und „++“ verwendet werden. Dies ist nur eine erweiterte Einführung. Die spezifische Schreibmethode hängt von den einheitlichen Standards des Teams ab.

Math.ceil() und Math.floor-Rundung aufgeben

Vielleicht haben Sie diese beiden Symbole ~~ und |0 in anderen Codes gesehen, schauen Sie sich einfach die laufenden Ergebnisse an:

>> var a1 = 1.23
>> ~~a1
1
>> var a2 = 2.345
>> a2|0
2
>> var a3 = -3.45
>> ~~a3
-3
>> var a4 = -4.5
>> a4|0
-4

Bitte beachten Sie, dass diese Schreibweise nicht originell ist, sondern lediglich zitiert wird, um diese alternative Schreibweise zu analysieren und zu erklären. Kurz erklärt: ~ ist ein bitweiser Negationsoperator, der eine Gleitkommazahl in eine Ganzzahl umwandeln kann, indem alle Ziffern nach dem Dezimalpunkt verworfen werden. Positive ganze Zahlen können in vorzeichenlose Hexadezimalwerte umgewandelt werden. Negieren Sie es dann erneut (~~), um die ursprüngliche Ganzzahl zu erhalten. Wenn Sie so eigensinnig sind und die Methode nicht anpassen möchten, denken Sie dann, dass es sich um eine Optimierung handelt?

Hinweis: Wenn Sie strikte Rundungsoperationen durchführen müssen, sollten Sie diese Methode mit Vorsicht verwenden, dann müssen Sie trotzdem die Math-Funktion verwenden.

wenn und sonst sind nicht die einzigen

Die bedingte Beurteilung mit if-else ist eine sehr klare Logik, sieht jedoch nicht sehr prägnant aus, wenn die verarbeitete Datenmenge nicht groß ist:

if (a===1) { //此处强烈建议用严格等于符号“===”，不会进行类型转换
a=2
} else if (a===3) {
a=4
} else {
a=5
}

Schauen Sie sich die Verwendung von || und && an, um den Code zu verschlanken:

((a===1)&&(true,a=2))||((a===3)&&(true,a=4))||(a=5)

Erledigen Sie es in nur einem Schritt und verlieren Sie erfolgreich Gewicht. ||. und &&, das Prinzip ist natürlich nicht leicht zu verstehen. Sie können es weiterhin durch den ternären Operator ersetzen

(a===1 )? a=2:( (a===3) ? (a=4) : (a=5) )

var template = "<div>" 
+ "<h2>{title}</h2>"
+ "<div class='content' yAttr=''>{content}</div>"
+ "</div>"

var template = <div> 
<h2>{title}</h2> 
<div class='content' yAttr=''>{content}</div> 
</div>

var rComment = /\/\*([\s\S]*?)\*\//;
// multiply string 
function ms(fn){ 
return fn.toString().match(rComment)[1]
}; 
ms(function(){/* 
<div> 
<h2>{title}</h2> 
<div class='content' yAttr=''>{content}</div> 
</div> */
})

AMD-Modulunterstützung hinzufügen, Eingabeaufforderungscode-B-Feld

(function( factory ) { 
if ( typeof define === "function" && define.amd ) { 
// AMD模式。且依赖"jQuery"这个插件 
define( [ "jquery" ], factory ); } 
else { 
// 浏览器全局模式 
factory( jQuery ); 
} 
}(function( $ ) { 
// 这里放模块代码 
return $.widget; 
}));

Optimale Methode erben

function Parent() {}
function Child() {}
Child.prototype = Parent.prototype
Child.prototype.constructor = Child ；

function Empty(){}
Empty.prototype = Parent.prototype;
Child.prototype = new Empty();
Child.prototype.constructor = Child;