Heim > Artikel > Web-Frontend > Eine Zusammenfassung von Tipps, wie Sie häufige Fallstricke in JavaScript vermeiden können
1. Haben Sie versucht, die Array-Elemente zu sortieren?
JavaScript verwendet standardmäßig die alphanumerische Reihenfolge. Daher ist das Ergebnis von [1,2,5,10].sort() [1, 10, 2, 5].
Wenn Sie richtig sortieren möchten, sollten Sie Folgendes tun: [1,2,5,10].sort((a, b) => a - b)
2. new Date() ist sehr einfach zu verwenden
new Date() kann Folgendes empfangen:
- empfängt keine Parameter: gibt die aktuelle Uhrzeit zurück
- Empfängt einen Parameter „x“: Gibt den Wert vom 1. Januar 1970 + „x“ Millisekunden zurück.
- „new Date(1, 1, 1)“ gibt den 1. Februar 1901 zurück.
- Allerdings... fügt „new Date(2016, 1, 1)“ nicht 2016 zu 1900 hinzu, sondern stellt nur 2016 dar.
3. Die Ersatzfunktion ersetzt nicht wirklich?
let s = "bob" const replaced = s.replace('b', 'l') replaced === "lob" // 只会替换掉第一个b s === "bob" // 并且s的值不会变
Wenn Sie alle bs ersetzen möchten, verwenden Sie reguläre Ausdrücke:
"bob".replace(/b/g, 'l') === 'lol'
4 Seien Sie vorsichtig mit Vergleichsoperationen
// 这些可以 'abc' === 'abc' // true 1 === 1 // true // 然而这些不行 [1,2,3] === [1,2,3] // false {a: 1} === {a: 1} // false {} === {} // false
weil [ 1, 2,3] und [1,2,3] sind zwei verschiedene Arrays, sie haben nur zufällig die gleichen Elemente. Daher kann es nicht einfach nach „===“ beurteilt werden.
5. Array ist kein Basistyp
typeof {} === 'object' // true typeof 'a' === 'string' // true typeof 1 === number // true // 但是.... typeof [] === 'object' // true
Wenn Sie feststellen möchten, ob eine Variable „var“ ein Array ist, müssen Sie `Array.isArray(var)`
verwenden.
6. Abschluss
Dies ist eine klassische JavaScript-Interviewfrage:
const Greeters = [] for (var i = 0 ; i < 10 ; i++) { Greeters.push(function () { return console.log(i) }) } Greeters[0]() // 10 Greeters[1]() // 10 Greeters[2]() // 10
Obwohl die erwartete Ausgabe 0,1,2,... ist, Aber eigentlich ist das nicht der Fall. Wissen Sie, wie man debuggt?
Es gibt zwei Möglichkeiten:
- Verwenden Sie „let“ anstelle von „var“.
- Verwenden Sie die „Bind“-Funktion.
Greeters.push(console.log.bind(null, i))
Natürlich gibt es viele Lösungen. Diese beiden sind meine Favoriten!
7. Über bind
Was wird der folgende Code ausgeben?
class Foo { constructor (name) { this.name = name } greet () { console.log('hello, this is ', this.name) } someThingAsync () { return Promise.resolve() } asyncGreet () { this.someThingAsync() .then(this.greet) } } new Foo('dog').asyncGreet()
Wenn Sie sagen, dass das Programm abstürzt und einen Fehler meldet: Cannot read property 'name' of undefined
.
Weil das „geet“ in Zeile 16 nicht in der richtigen Umgebung ausgeführt wird. Natürlich gibt es viele Möglichkeiten, diesen Fehler zu beheben!
- Verwenden Sie lieber die Funktion „bind“, um das Problem zu lösen:
asyncGreet () { this.someThingAsync() .then(this.greet.bind(this)) }
Dadurch wird sichergestellt, dass „greet“ von der Foo-Instanz aufgerufen wird und nicht von der lokalen Funktion „ das`.
- Wenn Sie möchten, dass „greet“ niemals an den falschen Bereich gebunden wird, können Sie „bind“ im Konstruktor verwenden.
class Foo { constructor (name) { this.name = name this.greet = this.greet.bind(this) } }
- Sie können auch Pfeilfunktionen (=>) verwenden, um zu verhindern, dass der Bereich geändert wird.
asyncGreet () { this.someThingAsync() .then(() => { this.greet() }) }
8. Math.min() ist größer als Math.max()
Math.min() < Math.max() // false
, da Math.min()
Unendlich und Math.max()
-Unendlich zurückgibt.
Das obige ist der detaillierte Inhalt vonEine Zusammenfassung von Tipps, wie Sie häufige Fallstricke in JavaScript vermeiden können. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!