Ternärer Operator in TypeScript

Migel Hewage Nimesha 15 Februar 2024
  1. TypeScript-Operatoren
  2. Verwenden Sie den ternären Operator in TypeScript
  3. Implementieren Sie verschachtelte Bedingungen mit dem ternären Operator in TypeScript
Ternärer Operator in TypeScript

In diesem Artikel werden wir die verschiedenen Operatoren in TypeScript kurz vorstellen und die ternären Operatoren und ihre Verwendung diskutieren.

TypeScript-Operatoren

Softwareanwendungen sollen mit Daten arbeiten. Daher haben sie eine Möglichkeit entwickelt, verschiedene Operationen mit diesen Daten durchzuführen.

Jede Operation arbeitet mit einem oder mehreren Datenwerten und generiert ein Endergebnis. Diese Operationen können in verschiedene Gruppen eingeteilt werden.

Operanden und Operatoren in TypeScript

Normalerweise bearbeitet ein Operator mindestens einen Datenwert, der als Operand bezeichnet wird. Beispielsweise sind im Ausdruck 500 + 200 die Werte 500 und 200 zwei Operanden, und + ist der Operator.

In TypeScript sind mehrere Operatoren zu sehen. Diese können basierend auf der Art der Operation jedes Operators in Gruppen eingeteilt werden, z. B. arithmetisch, logisch, bitweise, relational usw.

Außerdem können diese Operatoren basierend auf der Anzahl der Operanden gruppiert werden, die jeder Operator erwartet. Der binäre Operator hat zwei Operanden, wie im Folgenden gezeigt.

Beispiel:

x * y
20 / 2

Der unäre Operator benötigt nur einen Operanden.

Beispiel:

x++
y--

Die TypeScript-Sprache unterstützt einen ternären Operator, der mit drei Operanden arbeitet; es ist das verkürzte Format der if...else-Syntax. Wir nennen ihn den Bedingungsoperator von TypeScript.

Verwenden Sie den ternären Operator in TypeScript

Der Bedingungsoperator von TypeScript benötigt drei Operanden. Die erste ist die auszuwertende Bedingung; es kann als if()-Teil in der üblichen if...else-Syntax identifiziert werden.

Die nächsten zwei Operanden sind die zwei Ausdrücke, die basierend auf den ausgewerteten Bedingungsergebnissen ausgeführt werden sollen. Der zweite Operand ist also der Ausdruck, der ausgeführt werden soll, wenn die Bedingung als true ausgewertet wird.

Andernfalls wird der dritte Operandenausdruck zurückgegeben.

Syntax:

<your_condition> ? <expression_A> : <expression_B>

Wo:

  1. <your_condition> ist die auszuwertende Bedingung. Es ist ein boolescher Ausdruck, der entweder true oder false zurückgibt.
  2. <expression_A> ist der Ausdruck, der zurückgegeben werden soll, wenn die Bedingung true ist.
  3. <expression_B> ist der Ausdruck, der zurückgegeben werden soll, wenn die Bedingung false ist.

Der Bedingungsoperator ist der einzige ternäre Operator, der in der TypeScript-Sprache verfügbar ist.

Lassen Sie uns einen TypeScript-Code schreiben, um das Alter des Benutzers zu überprüfen, der eine darauf basierende Nachricht zurückgibt. Zuerst schreiben wir die bedingte Logik mit gewöhnlichem if...else.

const MAX_ALLOWED_AGE = 18;
let userAge = 15;
let finalMessage = '';

if( userAge >= MAX_ALLOWED_AGE ) {
    finalMessage = 'You are allowed to this site';
} else {
    finalMessage = 'Get Back!!'
}

console.log(finalMessage);

Ausgabe:

Ternäre TypeScript-Operatorausgabe 1

Die gleiche Logik kann mit dem ternären Operator kompakter geschrieben werden.

const MAX_ALLOWED_AGE = 18;
let userAge = 15;
let finalMessage = userAge >= MAX_ALLOWED_AGE ? 'You are allowed to this site' : 'Get Back!!';

console.log(finalMessage);

Sie erhalten die gleiche Ausgabe wie in der obigen if...else-Logik. Das sind weniger Zeilen als die if...else-Syntax und sauberer.

Implementieren Sie verschachtelte Bedingungen mit dem ternären Operator in TypeScript

Der ternäre Operator ist nicht auf eine einzige Bedingung beschränkt. Es unterstützt auch mehrere Bedingungen.

Schauen wir uns die verschachtelte if...else-Bedingungslogik an, wie im Folgenden gezeigt.

let studentMark = 68;
const GRADE_A_MARK = 75;
const GRADE_B_MARK = 61;
let finalMessage = '';

if( studentMark >= GRADE_A_MARK ) {
    finalMessage = 'Great work!';
} else if(studentMark >= 61 && studentMark < 75) {
    finalMessage = 'Good work!';
} else {
    finalMessage = 'Study more!!!';
}

console.log(finalMessage);

Ausgabe:

Ternäre TypeScript-Operatorausgabe 2

Lassen Sie uns die obigen verschachtelten Bedingungen mit dem ternären Operator schreiben.

let studentMark = 68;
const GRADE_A_MARK = 75;
const GRADE_B_MARK = 61;
let finalMessage = studentMark >= GRADE_A_MARK ? 'Great work!' : studentMark >= 61 && studentMark < 75 ? 'Good work!' : 'Study more!!!';

console.log(finalMessage);

Wenn Sie den obigen TypeScript-Code transpilieren und mit node ausführen, erhalten Sie die gleiche Ausgabe wie im obigen if...else-Szenario.

Es wird empfohlen, in Ihrem Code einen Bedingungsoperator zu verwenden. Es ist ein einzeiliger Ausdruck, der Ihren Code sauberer macht.

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 - TypeScript Operator