Heim > Web-Frontend > js-Tutorial > Sechs Dinge, auf die Sie im täglichen JavaScript-Code achten sollten

Sechs Dinge, auf die Sie im täglichen JavaScript-Code achten sollten

韦小宝
Freigeben: 2018-03-14 13:06:56
Original
1284 Leute haben es durchsucht

Jeder muss darauf achten, ob einige Codes bei der täglichen JavaScript-Entwicklung schiefgehen. Heute werden wir die sechs fehleranfälligen Teile zusammenfassen, auf die bei der täglichen Entwicklung von JavaScript I geachtet werden muss Ich glaube, viele Schüler müssen es lesen. Kommen wir ohne weitere Umschweife direkt zur Sache!

Funktion sofort ausführen

Funktion sofort ausführen, normalerweise als Abschluss, und einen Variablenbereich auf Funktionsebene erstellen können. Die allgemeine Schreibmethode lautet wie folgt:

(function () {
  // code
})();
Nach dem Login kopieren

Diese Schreibmethode kann jedoch leicht zu Problemen führen, wenn der obige Code beispielsweise nicht mit einem Semikolon endet:

var a = 1
(function () { // Uncaught TypeError: 1 is not a function
})()
Nach dem Login kopieren

, dann sollte es so geschrieben werden:

void function () {
  // code
}();
Nach dem Login kopieren

oder:

!function () {
  // code
}();
Nach dem Login kopieren
;(function(){
   //code
})()
Nach dem Login kopieren

Welches Sie wählen, hängt von Ihren persönlichen Vorlieben ab. Nun gibt es eine Spezifikation in js namens StandardJS-Spezifikation, die das Weglassen des Semikolons am Ende der Zeile befürwortet (ich bin daran nicht gewöhnt), muss diese Gewohnheit geändert werden.

2. Leeres Objekt null

Seit der Geburt von JS wurde null der Typ Objektklasse zugewiesen. Man kann sagen, dass es sich um einen lebenslangen Fehler von JS handelt. Es ist nie wieder passiert und wird sich auch nie wieder ändern.

null hat nicht die grundlegenden Eigenschaften eines Objekts und gehört zum ursprünglichen Datentyp . Ich möchte erklären, dass Sie vor der Beurteilung, ob eine Variable ein Objekt ist, zunächst beurteilen sollten, ob sie null ist.

if (opt!== null && typeof opt=== 'object') {
  // opt是一个对象
}
Nach dem Login kopieren

3. Vergleichen Sie Dezimalzahlen nicht willkürlich

Achten Sie bei Berechnungen zwischen Dezimalzahlen auf die Genauigkeit vor Gleitkommazahlen.

zum Beispiel: Ist 0,1+0,2 gleich 0,3? , dann konvertieren Sie zuerst die Dezimalzahl in

string

und verwenden Sie toFixed, um die Dezimalstellen zum Vergleich zu entfernen:

Hinweis: Wenn die Differenz zwischen zwei Zahlen bis zu einem bestimmten Bereich klein genug ist , können sie als gleich betrachtet werden.

(0.1 + 0.2).toFixed(2) === '0.30'
Nach dem Login kopieren
4. Denken Sie immer an NaN

Wenn es um NaN geht, gibt es eine Eigenschaft, an die jeder denken sollte: NaN !==NaN. Ja, das ist cool.
Math.abs(0.1+0.2 - 0.3) <= 1e-10 // true
Nach dem Login kopieren

Wenn Sie feststellen müssen, ob eine Variable NaN ist, vergleichen Sie sie einfach mit sich selbst. Wenn sie nicht gleich sind, dann ist es NaN.

Um festzustellen, ob eine Zahl NaN ist, können Sie die Methode isNaN() verwenden. Wenn Sie jedoch den spezifischen Datentyp einer Variablen nicht kennen, sollten Sie diese Methode nicht zur einfachen Beurteilung verwenden, da isNaN eine seltsame Eigenschaft aufweist: Es wandelt die zu beurteilende Variable zunächst zur Berechnung in einen numerischen Wert um.

Dann wird dies für Überraschungen in Ihrem Urteil sorgen.

Ein weiterer zu beachtender Punkt ist, niemals eine Variable mit NaN zu vergleichen, wie zum Beispiel: opt===NaN.
isNaN(&#39;abc&#39;) // true
isNaN(&#39;123&#39;) // false
isNaN(&#39;&#39;) // false
isNaN([]) // false
isNaN({}) // true
Nach dem Login kopieren

5. Verwenden Sie zusätzlich zum Vergleich von null und undefiniert niemals nicht striktes == und! =

Ich glaube, Sie werden viele Artikel und Spezifikationen sehen, die besagen, dass Sie versuchen, === und zu verwenden! ==, verwenden Sie nicht == und ! =, der Grund dafür ist, dass Letzteres eine erzwungene

Typkonvertierung

durchführt (was schwer zu findende Fehler verursacht).

Schauen Sie sich zuerst um:

Wenn Sie Zweifel an der obigen Beurteilung haben, dann erinnern Sie sich an eine Regel:

&#39;true&#39; == true // => false
'true' == false // => false
[] == {} // => false
[] == [] // => false
Nach dem Login kopieren
Das heißt, beurteilen Sie, ob x ist null oder undefiniert, dann verwenden Sie ==, andernfalls verwenden Sie es niemals.

6. Mit Vorsicht verwenden ||. Legen Sie einen Standardwert für eine Variable fest. Ich glaube, dass JS-Entwickler, die schon seit vielen Jahren im Spiel sind, so schreiben werden:
null == null // => true
undefined == undefined  // => true
null == undefined // => true
undefined == null // => true
x == null // => false (x 非 null 或 undefined)
x == undefined // => false (x 非 null 或 undefined)
Nach dem Login kopieren

Erklären Sie, dass arg1 || arg2 bedeutet, dass, wenn arg1 in true konvertiert werden kann, arg1 verwendet wird, andernfalls arg2.

Werfen wir also zunächst einen Blick auf die Werte, die nicht in wahr umgewandelt werden können?

page = page || 0;
data = data || '你好';
Nach dem Login kopieren
1.undefiniert

2.null

3.NaN

4. Ganzzahl 0

5

所以如果当用户传给arg1的参数是0或者为空字符串“”的时候,那么最终的值就会取默认的(||后面)值是不是?好,问题来了。如果用户传给后台的查询关键字data(上面代码)是空字符串“”,那么就应该按照空字符串“”去后台数据库查询,而结果传给后台的却是“你好”,显然查询结果也就不对。

好,回到主题,实际上只有undefined才应该被认为是用户没有指定其具体值,我曾看过有人这样理解(null 表示 用户让你给他把这个位置空着;而 undefined 表示 用户没发表意见

so :

page = page !== undefined ? page : 0;
data = data !== undefined ? data :'你好';
Nach dem Login kopieren

只需判断undefined即可。

个人理解如果有需求,可以把null加进去判断。

Das obige ist der detaillierte Inhalt vonSechs Dinge, auf die Sie im täglichen JavaScript-Code achten sollten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage