Beispiel-Tutorial zur JavaScript-Typerkennungsmethode

Vorwort

JavaScript ist eine der am häufigsten verwendeten Sprachen im Web-Frontend und nimmt in vielen Bereichen wie der Erstellung von Webanwendungen, Skripts und kleinen Programmen eine unersetzliche Position ein. Der Autor hat das Front-End einige Zeit studiert und ist der Ansicht, dass die JS-Wissenspunkte ziemlich kompliziert sind. Daher zeichnet er einige der Kenntnisse, Gedanken und Erkenntnisse auf, die er gewonnen hat.

JS-Grundtypen

Die Basistypen von JavaScript werden in primitive Basistypen und Referenzdatentypen unterteilt:

Primitive Grundtypen:

• Nummer
• Schnur
• Boolescher Wert
• Null
• undefiniert
• Symbol

Referenzdatentypen:

• Objekt
• Funktion
• Anordnung
• Datum
• Regulärer Ausdruck
  

Hinweis: In ES5 gibt es keinen Symboltyp

Typerkennung

Es gibt fünf gängige Methoden zur Typerkennung:

1. Art von
2. Instanz von
3. Objekt.prototype.toString
4. Konstruktor
5. Ententyp
   

1.typeof bestimmt den Basistyp

Die vom Schlüsselwort typeof zurückgegebenen Typnamen umfassen nur die folgenden 7 Typen: Zahl, Zeichenfolge, Boolescher Wert, undefiniert, Symbol, Objekt, Funktion.

Null und die meisten Referenztypen können nicht mit typeof beurteilt werden.

sei num = 32
lass str = "32"
let bool = true
lass nul = null
let undef = undefiniert
let sym = Symbol()

const obj = neues Objekt()
const arr = neues Array()
const fun = neue Funktion()
const date = neues Date()
const reg = neuer RegExp()

console.log(Typ von num) //Nummer
console.log(Typ von str) //Zeichenfolge
console.log(Typ von bool) //Boolesch
console.log(Typ von nul) //Objekt
console.log(typeof undef) //undefiniert
console.log(Typ von sym) //Symbol

console.log(Objekttyp) //Objekt
console.log(Typ von arr) //Objekt
console.log(Typ von Spaß) //Funktion
console.log(Datumstyp) //Objekt
console.log(Typ der Registrierung) //Objekt

Hinweis: Wenn Sie typeof verwenden, um Null, Array, Date, RegExp usw. zu beurteilen, sind die Ergebnisse alle Objekte

2.instanceof bestimmt den Referenzdatentyp

Instanceof verwendet die Eigenschaft __proto__ der Variablen, um zur Typbeurteilung auf die Prototypeigenschaft des Prototyps zu verweisen. Es ist zu beachten, dass die Eigenschaft __proto__ nicht vorhanden ist und wir den Konstruktor verwenden müssen, wenn die direkte Zuweisungsmethode für grundlegende Datentypen verwendet wird.

const obj = neues Objekt()
const arr = neues Array()
const fun = neue Funktion()
const date = neues Date()
const reg = neuer RegExp()

console.log(obj Instanz von Objekt) //true
console.log(arr Instanz von Array) //true
console.log(fun Instanz der Funktion) //true
console.log(Datumsinstanz von Date) //true
console.log(reg-Instanz von RegExp) //true

sei num1 = 32
sei num2 = neue Zahl(32)
console.log(num1 Instanz von Number) //false
console.log(num2 Instanz von Number) //true

Obwohl instanceof feststellen kann, dass arr eine Instanz von Array ist, denkt es außerdem, dass es eine Instanz von Object ist, was für die Feststellung eines unbekannten Referenztyps nicht benutzerfreundlich ist.

const arr = neues Array()
console.log(arr Instanz von Array) //true
console.log(arr Instanz von Objekt) //true

Der Grund dafür ist, dass die __proto__-Eigenschaft von arr.__proto__ auf das Prototypobjekt von Object verweist.

In diesem Fall können Sie zur Entscheidungsfindung den Konstruktor verwenden.

Hinweis: instanceof kann nicht zur Objekterkennung zwischen verschiedenen Fenstern oder Iframes verwendet werden!

3. Object.prototype.toString bestimmt den Typ

toString() ist die Prototypmethode von Object. Jedes Objekt, das Object erbt, hat eine toString-Methode.

Alle Objekte, deren typeof den Wert object zurückgibt, enthalten eine interne Eigenschaft [[class]], auf die nicht direkt zugegriffen werden kann und die normalerweise über Object.prototype.toString() angezeigt wird.

Wenn die Methode toString nicht überschrieben wird, gibt sie standardmäßig die [[Klasse]] des aktuellen Objekts im Format [Objekt Xxx] zurück, wobei Xxx der Typ des Objekts ist. Wenn jedoch andere Typen, mit Ausnahme von Objekten vom Typ „Object“, die Methode „toString“ direkt verwenden, direkt ein String mit dem Inhalt zurückgegeben wird, müssen wir den Ausführungskontext der Methode „toString“ mit der Methode „call“ oder „apply“ ändern.

sei num = 32
lass str = "32"
let bool = true
lass nul = null
let undef = undefiniert
let sym = Symbol()

const obj = neues Objekt()
const arr = neues Array()
const fun = neue Funktion()
const date = neues Date()
const reg = neuer RpgExp()

console.log(Object.prototype.toString.apply(num)) //"[Objektnummer]"
console.log(Object.prototype.toString.apply(str)) //"[Objekt String]"
console.log(Object.prototype.toString.apply(bool)) //"[Objekt Boolean]"
console.log(Object.prototype.toString.apply(nul)) //"[Objekt Null"
console.log(Object.prototype.toString.apply(undef)) //"[Objekt undefiniert]"
console.log(Object.prototype.toString.apply(sym) //"[Objektsymbol]"

console.log(Object.prototype.toString.call(obj)) //"[Objekt Objekt]"
console.log(Object.prototype.toString.call(arr)) //"[Objekt-Array]"
console.log(Object.prototype.toString.call(fun)) //"[Objektfunktion]"
console.log(Object.prototype.toString.call(date)) //"[Objekt Datum]"
console.log(Object.prototype.toString.call(reg) //"[Objekt RegExp]"

Object.prototype.toString kann null bestimmen, aber wir verwenden normalerweise null===null, um zu bestimmen, ob es null ist.

4. Konstruktor bestimmt den Typ

Die Konstruktor-Eigenschaft gibt den Konstruktor der Variablen zurück. Natürlich können Sie auch die Zeichenfolge abfangen, um den Konstruktornamen abzurufen und zu beurteilen, ob ein Boolescher Wert erhalten wird, z. B. " ".constructor === String.

sei num = 32
lass str = "32"
let bool = true
lass nul = null
let undef = undefiniert
let sym = Symbol()

const-Objekt = neues Objekt()
const arr = neues Array()
const fun = neue Funktion()
const date = neues Date()
const reg = neuer RegExp()

console.log(num.constructor) //ƒ Zahl() { [nativer Code] }
console.log(str.constructor) //ƒ String() { [nativer Code] }
console.log(bool.constructor) //ƒ Boolean() { [nativer Code] }
console.log(nul.constructor) //Nicht abgefangener TypeError: Kann Eigenschaft „constructor“ von null nicht lesen
console.log(undef.constructor) //Nicht abgefangener TypeError: Kann Eigenschaft „constructor“ von undefined nicht lesen
console.log(sym.constructor) //ƒ Symbol() { [nativer Code] }

console.log(obj.constructor === Objekt) //wahr
konsole.log(arr.constructor === Array) //wahr
konsole.log(fun.constructor === Funktion) //wahr
konsole.log(Datum.Konstruktor === Datum) //wahr
Konsole.log(reg.constructor === RegExp) //wahr

Der Konstruktor kann nicht verwendet werden, um Null und Undefiniert zu bestimmen, aber er kann vermieden werden, wenn instanceof verwendet wird. Das Prototypobjekt von arr kann entweder Array oder Object sein.

5. Der Ententyp verwendet Merkmale, um den Typ zu bestimmen

Ducktyping ist in der Programmierung eine Art der dynamischen Typisierung. Bei diesem Stil wird die effektive Semantik eines Objekts nicht durch die Vererbung von einer bestimmten Klasse oder die Implementierung einer bestimmten Schnittstelle bestimmt, sondern durch den „aktuellen Satz von Methoden und Eigenschaften“.

„Wenn Sie einen Vogel sehen, der wie eine Ente läuft, wie eine Ente schwimmt und wie eine Ente quakt, dann kann man diesen Vogel als Ente bezeichnen.“

Beim Duck-Typing liegt der Fokus auf dem Verhalten des Objekts, also darauf, was es kann, und nicht auf dem Typ des Objekts.

Beispielsweise könnten wir in einer Sprache, die kein Duck-Typing verwendet, eine Funktion schreiben, die ein Objekt vom Typ „Ente“ annimmt und dessen Methoden „Walk“ und „Quack“ aufruft.

Später können Sie in einer Funktion, die Duck-Typing verwendet, ein Objekt beliebigen Typs akzeptieren und dessen Methoden „Walk“ und „Quack“ aufrufen. Wenn die aufzurufenden Methoden nicht vorhanden sind, wird ein Laufzeitfehler ausgelöst. Jedes Objekt mit den richtigen „go“- und „call“-Methoden wird von dieser Funktion akzeptiert.

Um beispielsweise festzustellen, ob ein Objekt ein Array ist, können Sie sehen, ob das Objekt über Methoden wie push() verfügt.

Zusammenfassen

Dies ist das Ende dieses Artikels zur JavaScript-Typerkennung. Weitere relevante Inhalte zur JavaScript-Typerkennung finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!