Zusammenfassung gängiger Javascript-Tipps_Javascript-Tipps

Die Beispiele in diesem Artikel beschreiben gängige Javascript-Tipps. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

1. Wahre und falsche boolesche Ausdrücke

Die folgenden booleschen Ausdrücke geben alle „false“ zurück:

null
undefiniert
'' leere Zeichenfolge
0 Nummer 0

Aber seien Sie vorsichtig mit den folgenden Punkten, sie geben alle „true“ zurück:

'0' Zeichenfolge 0
[] Leeres Array
{} leeres Objekt

Der folgende schreckliche Code:

Code kopieren Der Code lautet wie folgt:

while (x != null) {

Sie können es direkt in der folgenden Form schreiben (solange Sie möchten, dass x anders als 0 und eine leere Zeichenfolge und falsch ist):

Code kopieren Der Code lautet wie folgt:

while (x) {

Wenn Sie überprüfen möchten, ob eine Zeichenfolge null oder leer ist:

Code kopieren Der Code lautet wie folgt:

if (y != null && y != '') {

Aber das wäre besser:

Code kopieren Der Code lautet wie folgt:

if (y) {

Hinweis: Es gibt noch viele Dinge zu beachten, wie zum Beispiel:

Boolean('0') == true
'0' != wahr
0 != null
0 == []
0 == falsch
Boolean(null) ==false
null != wahr
null != false
Boolean(undefiniert) ==false
undefiniert != true
undefiniert != false
Boolean([]) == true
[] != true
[] == false
Boolean({}) == true
{} != true
{} != false

2. Bedingter (ternärer) Operator (?:)

Der ternäre Operator wird verwendet, um den folgenden Code zu ersetzen:

if (val != 0) {
 return foo();
} else {
 return bar();
}

Sie können schreiben:

Code kopieren Der Code lautet wie folgt:

Rückgabewert ? foo() : bar();

Auch nützlich beim Generieren von HTML-Code:

Code kopieren Der Code lautet wie folgt:

var html = '';

Drei, && und ||

Binäre boolesche Operatoren sind kurzschließbar und das letzte Element wird nur bei Bedarf ausgewertet.

„||“ wird als „Standard“-Operator bezeichnet, weil er folgendermaßen funktioniert:

function foo(opt_win) {
 var win;
 if (opt_win) {
  win = opt_win;
 } else {
  win = window;
 }
 // ...
}

Sie können dies verwenden, um den obigen Code zu vereinfachen:

function foo(opt_win) {
 var win = opt_win || window;
 // ...
}

„&&“ kann auch ein Kurzcode sein, zum Beispiel:

if (node) {
 if (node.kids) {
  if (node.kids[index]) {
   foo(node.kids[index]);
  }
 }
}

Sie können es so verwenden:

if (node && node.kids && node.kids[index]) {
 foo(node.kids[index]);
}

oder:

var kid = node && node.kids && node.kids[index];
if (kid) {
 foo(kid);
}

Aber das ist etwas zu viel:

Code kopieren Der Code lautet wie folgt:

node && node.kids && node.kids[index] && foo( node.kids [index]);

4. Verwenden Sie join(), um eine Zeichenfolge zu erstellen

wird normalerweise so verwendet:

function listHtml(items) {
 var html = '';
 for (var i = 0; i < items.length; ++i) {
 if(i > 0) { html += ', ';
 }
 html += itemHtml(items[i]);
 }
 html +='';
 return html;
}

Aber das ist unter IE sehr langsam. Sie können die folgende Methode verwenden:

function listHtml(items) {
 var html = [];
 for (var i = 0; i < items.length; ++i) {
  html[i] = itemHtml(items[i]);
 }
 return '' + html.join(', ') + '';
}

Sie können auch ein Array als String-Konstruktor verwenden und es dann über myArray.join('') in einen String konvertieren. Da die Zuweisungsoperation jedoch schneller ist als push() des Arrays, versuchen Sie es mit die Zuweisungsoperation.

5. Traverse-Knotenliste

Knotenlisten werden durch Hinzufügen eines Filters zum Knoteniterator implementiert. Dies bedeutet, dass die Zeitkomplexität zum Erhalten seiner Attribute, wie z. B. der Länge, O(n) beträgt und das Durchlaufen der gesamten Liste durch die Länge O(n^2) erfordert ).

var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0; i < paragraphs.length; i++) {
 doSomething(paragraphs[i]);
}

Das wird besser:

var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) {
 doSomething(paragraph);
}

Diese Methode funktioniert für alle Sammlungen und Arrays (solange das Array keine falschen Werte enthält).

Im obigen Beispiel können Sie die untergeordneten Knoten auch über firstChild und nextSibling durchlaufen.

var parentNode = document.getElementByIdx_x('foo');
for (var child = parentNode.firstChild; child; child = child.nextSibling) {
 doSomething(child);
}

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.