Verkettung von String und Integer in JavaScript

1. String und Integer mit Template String in JavaScript verketten
2. String und Integer mit dem Operator + in JavaScript verketten

Wenn wir Webanwendungen in JavaScript entwickeln, stoßen wir immer wieder auf eine Situation, in der wir eine Variable beliebigen Typs (Integer, Float usw.) mit einem String verketten möchten. Dies ist ein häufiges Szenario.

In diesem Artikel wird erläutert, wie wir die Vorlagenzeichenfolgenfunktion und den +-Operator verwenden können, um einen Zeichenfolgenwert mit einem ganzzahligen Wert in JavaScript zu verketten.

String und Integer mit Template String in JavaScript verketten

Mit der Vorlagenzeichenfolge in JavaScript können Sie Variablen beliebigen Typs innerhalb des angegebenen Zeichenfolgenwerts hinzufügen. Die Backtick-Zeichen (`) repräsentieren die Vorlagenzeichenfolge.

Um diese Funktion zu verwenden, müssen wir also unsere Zeichenfolge in die Backtick-Zeichen einschließen.

Wir verwenden hier nicht den traditionellen doppelten Anführungszeichen-Operator (" "). Der Template-String wird auch als Template-Literal bezeichnet.

Das Template-String-Feature wurde in der ES6-Version von JavaScript eingeführt.

Nehmen wir an, wir haben einen String und eine Integer-Variable value mit dem Wert 8, wie unten gezeigt. Unser Ziel ist es, den Wert der Variablen value mit dem String zu verketten und ihn dann auf der Konsole auszugeben.

Codeausschnitt - JavaScript:

let value = 8;
console.log('Number is the value.');

Ausgabe:

Number is the value.

Dazu müssen wir zunächst die doppelten Anführungszeichen (" ") des Strings durch die Backtick-Zeichen (`) ersetzen.

Nachdem wir den String mit Backticks umschlossen haben, können wir die Variable value irgendwo innerhalb des Strings verketten oder einfügen. Dazu müssen wir das ${} verwenden.

Und darin fügen wir die Variable ${value} hinzu, wie unten gezeigt.

Codeausschnitt - JavaScript:

let value = 8;
console.log(`Number ${value} is the value.`);

Ausgabe:

Number 8 is the value.

Wie Sie sehen können, wird der Wert 8 innerhalb der Zeichenfolge gedruckt. Wann immer wir einen String mit einer Variablen verketten wollen, verwenden wir das Konzept der String-Literale.

In ähnlicher Weise können Sie mit dieser Funktion viele Variablen mit beliebigem Typ in der Zeichenfolge verketten.

String und Integer mit dem Operator + in JavaScript verketten

Der +-Operator in JavaScript kann auch einen String mit einer Ganzzahl verketten. Wir nehmen das gleiche Beispiel, das wir oben gesehen haben, aber wir verwenden den +-Operator anstelle einer Vorlagenzeichenfolge.

Codeausschnitt - JavaScript:

let value = 8;
console.log('Number ' + value + ' is the value.');

Ausgabe:

Number 8 is the value.

Hier müssen wir die traditionellen doppelten Anführungszeichen auf einem String verwenden, und an welcher Stelle auch immer wir die Integer-Variable Wert mit dem String verketten wollen, müssen wir zuerst die doppelten Anführungszeichen schließen. Dann verwenden wir einen +-Operator vor und nach der Variablen Wert.

Danach können wir mit Hilfe von doppelten Anführungszeichen wieder mit der restlichen Zeichenfolge fortfahren, wie oben gezeigt.

Das einzige Problem bei der Verwendung des +-Operators besteht darin, dass wir, wenn Sie viele Variablen zwischen der Zeichenfolge verketten möchten, die Zeichenfolge mithilfe mehrerer +-Operatoren trennen müssen, wie unten gezeigt.

Wenn es viele Variablen gibt, die wir mit der Zeichenfolge verketten möchten, kann dies beim Lesen und Verstehen des Codes zu Problemen führen.

Codeausschnitt - JavaScript:

let value1 = 8;
let value2 = 16;
let value3 = 24;

console.log('Table of ' + value1 + ' has values ' + value2 + ' and ' + value3);

Ausgabe:

Table of 8 has values 16 and 24

Daher wird immer empfohlen, die Vorlagenliteralfunktion von ES6 so oft wie möglich zu verwenden. Und wenn es nur sehr wenige Variablen gibt, die mit der Zeichenfolge verkettet werden müssen, können Sie in diesem Fall den Operator + verwenden.