Heim > Web-Frontend > js-Tutorial > Mastering oder Operator in keinem JavaScript

Mastering oder Operator in keinem JavaScript

Mary-Kate Olsen
Freigeben: 2024-10-16 22:43:30
Original
929 Leute haben es durchsucht

Dominando o Operador in no JavaScript

Entdecken Sie, wie Sie Objekteigenschaften überprüfen

Wenn Sie in JavaScript programmieren, sind Sie möglicherweise auf Situationen gestoßen, in denen Sie wissen mussten, ob eine bestimmte Eigenschaft in einem Objekt vorhanden ist, und hier kommt der in-Operator ins Spiel. Ich zeige Ihnen, wie es funktioniert, wie Sie es verwenden und warum es effizienter sein kann als andere Methoden zum Überprüfen von Eigenschaften eines Objekts.

Was ist der In-Operator?

Der in-Operator wird in JavaScript verwendet, um zu überprüfen, ob eine Eigenschaft für ein Objekt vorhanden ist. Das Coole daran ist, dass es nicht nur die direkt im Objekt definierten Eigenschaften prüft, sondern auch die von den Prototypen geerbten.

Die Syntax ist sehr einfach:

'propriedade' in objeto;
Nach dem Login kopieren

Wenn die Eigenschaft vorhanden ist, wird „true“ zurückgegeben, und wenn sie nicht vorhanden ist, wird „false“ zurückgegeben. Es scheint einfach, oder? Doch sein Nutzen geht über eine einfache Überprüfung hinaus. Möchten Sie einige Beispiele sehen?

Beispiel 1: Direktes Eigentum am Objekt

Sehen wir uns zunächst ein einfaches Beispiel für die Verwendung des in-Operators zur Überprüfung einer direkten Eigenschaft an.

const carro = {
  marca: 'Toyota',
  ano: 2020
};

console.log('marca' in carro);  // true
console.log('modelo' in carro);  // false
Nach dem Login kopieren

Hier haben wir ein Autoobjekt mit den Eigenschaften Marke und Jahr. Wenn wir „Marke“ im Auto verwenden, ist das Ergebnis wahr, da die Markeneigenschaft direkt im Objekt vorhanden ist. 'model' in carro gibt false zurück, da diese Eigenschaft nicht definiert wurde.

Diese Art der Prüfung eignet sich hervorragend zur Vermeidung von Fehlern beim Versuch, auf nicht vorhandene Eigenschaften zuzugreifen. Haben Sie schon einmal versucht, auf eine nicht vorhandene Eigenschaft zuzugreifen und dabei den Code gebrochen? Ich schon! ?

Beispiel 2: Vom Prototyp geerbte Eigenschaften

Sehen Sie sich nun an, wie der in-Operator auch vom Prototyp geerbte Eigenschaften erkennt

const pessoa = {
  nome: 'Ana'
};

console.log('toString' in pessoa);  // true
Nach dem Login kopieren

In diesem Fall verfügt das Personenobjekt nicht direkt über die toString-Eigenschaft, sondern diese Funktion wird von Object.prototype geerbt. Der in-Operator kann dies sehen und gibt true zurück.

Warum ist das nützlich?

Manchmal möchten Sie möglicherweise überprüfen, ob im Objekt geerbte Funktionen verfügbar sind. Dies kann Ihnen in einigen komplexeren Situationen eine Rettung sein.

Beispiel 3: Vergleich mit hasOwnProperty

Jetzt machen wir einen Vergleich mit einer anderen Möglichkeit, Eigenschaften zu überprüfen, der hasOwnProperty-Methode. Es prüft nur, ob die Eigenschaft direkt auf dem Objekt definiert wurde, und ignoriert geerbte Eigenschaften.

const pessoa = {
  nome: 'Ana'
};
console.log(pessoa.hasOwnProperty('toString'));  // false
console.log('toString' in pessoa);               // true
Nach dem Login kopieren

Die hasOwnProperty-Methode gibt für toString false zurück, da sich diese Eigenschaft nicht direkt auf dem Personenobjekt befindet. Mittlerweile gibt der in-Operator „true“ zurück, da er auch geerbte Eigenschaften berücksichtigt.

Wann sollte man ine und wann hasOwnProperty verwenden?

Über die Antwort wird am meisten gesprochen, wenn man einen leitenden Entwickler etwas fragt, es kommt darauf an.

  • Verwenden Sie diese Option, wenn Sie Immobilien überprüfen möchten, unabhängig davon, ob sie direkt oder geerbt sind.
  • Verwenden Sie hasOwnProperty, wenn Sie sicherstellen müssen, dass die Eigenschaft direkt auf dem Objekt definiert wurde, und ignorieren Sie die vom Prototyp geerbten Eigenschaften. Der In-Operator ist viel praktischer, wenn Sie sich keine Gedanken über die Herkunft der Immobilie machen müssen, sondern beide ihren Platz auf dem Spielplatz haben, sodass Sie nur wissen müssen, an welcher Stelle und zu welchem ​​Zweck Sie sie benötigen.

Das obige ist der detaillierte Inhalt vonMastering oder Operator in keinem JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage