JavaScript-Rückgabe undefiniert

Migel Hewage Nimesha 12 Oktober 2023
  1. undefiniert in JavaScript
  2. Szenarien, die als Ausgabe undefined zurückgeben
  3. Unterschied zwischen undefiniert und null
  4. Abschluss
JavaScript-Rückgabe undefiniert

JavaScript hat weniger Bibliotheken oder Frameworks als andere Programmiersprachen. null und undefined repräsentieren leere Werte in JavaScript.

Um die Fehler zu reduzieren, die zusammen mit undefined auftreten, ist es ein Muss, den Grund für die Rückgabe von undefined genau zu verstehen. Verschaffen wir uns einen kurzen Überblick über undefined in JavaScript.

undefiniert in JavaScript

Unter den sechs primitiven JavaScript-Typen ist undefined ein besonderer Primitivtyp mit dem Wert undefined. Der einzige Wert, den der undefinierte Typ hat, ist einfach undefiniert.

undefined ist eine Variable mit globalem Geltungsbereich, die eine nicht beschreibbare und nicht konfigurierbare Eigenschaft ist. Gemäß den ECMA-Spezifikationen wird der Wert undefined zurückgegeben, wenn einer Variablen kein Wert zugewiesen wurde.

// uninitialized variable
let letters;
console.log(letters);

// non-existing array elements
let vowels = ['a', 'e'];
console.log(vowels[3]);

// non-existing object properties
let flower = {name: 'Rose'};
console.log(flower.color);

Ausgang:

undefined
undefined
undefined

Wie es in der Ausgabe aussieht, wird beim Zugriff auf eine nicht initialisierte Variable, nicht existierende Array-Elemente oder Objekteigenschaften der Wert undefined zurückgegeben. Nachdem wir jeden Codeabschnitt separat ausgeführt haben, können wir drei undefinierte Ausgaben erhalten.

Sehen wir uns die Situationen an, in denen JavaScript undefiniert zurückgibt, und einige Best Practices, um die Rückgabe von undefiniert zu lösen.

Szenarien, die als Ausgabe undefined zurückgeben

Zugriff auf eine nicht initialisierte Variable

Wenn wir eine Variable deklarieren, ohne einen Wert zu initialisieren, gibt die Variable undefiniert zurück.

Code:

let letters;
console.log(letters);

Ausgang:

undefined

Wie im Code-Chunk wird keiner der Werte der deklarierten Variable letters zugewiesen. Wie Sie in der Ausgabe oben sehen, gibt es beim Aufruf der Variablen undefined zurück, aber wenn wir der Variablen einen Wert zuweisen, gibt es den Wert unten zurück.

Code:

let letters = 5;
console.log(letters);

Ausgang:

5

Zugriff auf eine nicht vorhandene Eigenschaft

Beim Zugriff auf eine nicht vorhandene Eigenschaft wird undefined zurückgegeben, anstatt einen Fehler zu werfen. Das folgende Beispiel beweist das gut.

Code:

let flower = {name: 'Rose'};
console.log(flower.color);

Ausgang:

undefined

Hier hat die Objekteigenschaft Blume eine Eigenschaft als name. Aber beim Zugriff haben wir die Eigenschaft Farbe aufgerufen, die eine nicht vorhandene Eigenschaft dieses Objekts ist.

Wie in der Ausgabe zu sehen ist, liefert sie als Ausgabe den Wert undefined zurück.

Als Best Practice können wir die Verfügbarkeit der Eigenschaft mit der folgenden Syntax überprüfen, bevor wir darauf zugreifen. Dann können wir die Rückgabe von undefined als Ausgabe loswerden.

Syntax:

'propertyName' in objectName

Code:

let flower = {name: 'Rose'};

if ('color' in flower) {
  console.log(flower.color);
}

Funktionsparameter aufrufen

Wenn wir eine Funktion mit weniger Argumenten anstelle der definierten Anzahl von Argumenten aufrufen, gibt sie undefiniert zurück, da sie nicht alle Argumente übergibt. Daher müssen wir die Funktion mit der gleichen Anzahl von Argumenten aufrufen.

Code:

function multiply(a, b, c) {
  a;
  b;
  c;
  return a * b;
}
console.log(multiply(5, 3));

Ausgang:

15

Es hat Werte für a und b, 5 und 3 zugewiesen, wenn die Funktion mit zwei Argumenten aufgerufen wird, sodass 15 als Ausgabe zurückgegeben wird, nachdem diese Werte zugewiesen wurden.

Der folgende Code ruft dieselbe Funktion mit denselben zwei Werten auf, nachdem der Ausdruck der return-Anweisung geändert wurde, um insgesamt a, b und c zu multiplizieren.

Code:

function multiply(a, b, c) {
  a;
  b;
  c;
  return a * b * c;
}
console.log(multiply(5, 3));

Ausgang:

NaN

Wie in der Ausgabe gezeigt, gibt es NaN anstelle von Berechnungswerten zurück. Der Grund dafür ist, dass nicht alle Argumente übergeben werden und der Wert für c undefiniert bleibt.

die return-Anweisung einer Funktion

Ein weiterer Fall, in dem die Ausgabe als undefiniert zurückgegeben wird, ist, wenn eine Funktion keine return-Anweisung oder eine return-Anweisung ohne einen Ausdruck in der Nähe hat.

Lassen Sie uns zum Beispiel eine Funktion namens sq_num deklarieren, die eine Quadratzahl entsprechend der gegebenen Eingabe generiert.

Code:

// doesn't have a return statement
function sq_num(x) {
  const result = x * x;
}
console.log(sq_num(2));

// return statement without an expression
function sq_num(x) {
  const result = x * x;
  return;
}
console.log(sq_num(2));

Ausgang:

undefined
undefined

Wir müssen die return-Anweisung und einen Ausdruck deklarieren, der im folgenden Code erwähnt wird, um diese Funktion sq_num wie erwartet auszuführen. Dadurch können wir das Rechenergebnis der Funktion wie unten erhalten.

Code:

function sq_num(x) {
  const result = x * x;
  return result;
}
console.log(sq_num(2));

Ausgang:

4

Zugriff auf Out-Of-Bound-Elemente in Arrays

Wenn wir auf Elemente zugreifen, die nicht innerhalb des Arrays definiert sind, kann dies als Zugriff auf außerhalb der Grenzen liegende Elemente betrachtet werden. Tritt eine solche Situation ein, wird der Wert undefiniert zurückgegeben.

Code:

const animals = ['elephant', 'tiger', 'monkey'];
console.log(animals[5]);
console.log(animals[-1]);

Ausgang:

undefined
undefined

Auf die gleiche Weise stellen Sparse-Arrays das gleiche Problem dar. Sparse-Arrays sind Arrays mit Lücken und nicht indizierten Elementen.

Beim Zugriff auf die leeren Slots des Arrays liefert es ebenfalls den Wert undefined zurück.

Code:

const SparseArray = ['elephant', , 'monkey'];
console.log(SparseArray);

Ausgang:

["elephant", undefined, "monkey"]

Hier wird das Array SparseArray mit drei Elementen erstellt, wobei das zweite fehlt. Wie unten zu sehen ist, gibt es undefiniert zurück, wenn auf das zweite Element zugegriffen wird.

Code:

const SparseArray = ['elephant', , 'monkey'];
console.log(SparseArray[1]);

Ausgang:

undefined

Abgesehen von den oben genannten Szenarien wird der Wert undefined zusammen mit dem void-Operator zurückgegeben. Nachfolgend finden Sie Beispiele dafür, wie es trotz des Bewertungsergebnisses undefiniert zurückgibt.

Code:

void 2;
console.log(void (true));

Ausgang:

undefined

Unterschied zwischen undefiniert und null

JavaScript hat sowohl null- als auch undefined-Werte, die leere Werte darstellen.

Wenn eine Variable keinen explizit zugewiesenen Wert hat, weist JavaScript ihr den primitiven Wert undefiniert zu. Wie der Name schon sagt, ist null ein primitiver Wert, der das absichtliche Fehlen eines anderen zugewiesenen Werts darstellt.

Unter Verwendung des Operators typeof können wir wie unten eine Unterscheidung zwischen null und undefiniert sehen.

typeof undefined;
typeof null;
undefined
object

Insgesamt zeigt null fehlende Objekte an, während undefiniert der Wert ist, der in einer nicht initialisierten Variablen verwendet wird.

Abschluss

Dieser Artikel beschreibt das Vorkommen von undefined zusammen mit den nicht initialisierten Variablen, nicht vorhandenen Eigenschaften, Out-of-Bound-Indizes und dem Void-Operator.

Zusammen mit dem Besprochenen können einige der Best Practices angewendet werden, wenn Sie zusammen mit den Beispielen verwendet werden. Abgesehen davon haben wir uns den Unterschied zwischen null und den definierten Werten und deren Verwendungsinstanzen angesehen.

Als bewährte Methode sollten wir dafür verantwortlich sein, das Auftreten von undefined zu reduzieren, indem wir die Verwendung von nicht initialisierten Variablen und Arrays mit geringer Dichte reduzieren.

Migel Hewage Nimesha avatar Migel Hewage Nimesha avatar

Nimesha is a Full-stack Software Engineer for more than five years, he loves technology, as technology has the power to solve our many problems within just a minute. He have been contributing to various projects over the last 5+ years and working with almost all the so-called 03 tiers(DB, M-Tier, and Client). Recently, he has started working with DevOps technologies such as Azure administration, Kubernetes, Terraform automation, and Bash scripting as well.

Verwandter Artikel - JavaScript Function