TypeScript 中的字串插值
- TypeScript 中單個表示式的字串插值
- TypeScript 中多個表示式的字串插值
- TypeScript 中算術表示式的字串插值
- TypeScript 中條件表示式的字串插值
- TypeScript 中字串內建方法/函式的字串插值
- TypeScript 中自定義方法/函式的字串插值
在本教程中，我們將討論 TypeScript 中的字串插值，以涵蓋基本表示式和複雜表示式的概念。字串插值意味著呼叫靜態字串中的變數。
TypeScript 使用反引號進行字串插值，表示字串的起點和終點。
在這些反引號內呼叫字串，變數括在花括號/花括號中作為 {}，以美元符號作為 $ 開始。
TypeScript 中字串插值的語法如下所示。
TypeScript 中單個表示式的字串插值
TypeScript 可以處理字串插值中的表示式。讓我們用一個表示式來開始這個概念。
讓我們舉個例子：
let name1: string = "John Nash";
console.log(`My name is ${name1}.`);
輸出：
My name is John Nash.
在本例中，變數 name1 的值為 John Nash。變數 name1 具有型別 string。
現在控制檯語句具有靜態字串和變數。該字串在反引號之間呼叫，以及變數如何用佔位符括起來作為 ${name1}。
輸出語句使用變數 name1 值。這個概念被稱為字串插值。
讓我們再舉一個例子：
const age: number = 21;
console.log(`John is ${age} years old.`);
輸出：
John is 21 years old.
該字串使用型別為 number 的變數 age。在輸出語句中使用變數值 21。
TypeScript 中多個表示式的字串插值
字串插值也可以處理多個表示式。
例子：
let name1: string = "Smith";
let age: number = 20;
console.log(`My name is ${name1} and I am ${age} years old.`);
輸出：
My name is Smith and I am 20 years old.
多重表示式處理是字串插值。
請注意，型別為 string 和 number 的兩個變數 name1 和 age 包含在佔位符 ${} 中。
兩個以上表示式的另一個示例：
let name1: string = "Jack";
let age: number = 21;
let city: string = "New York";
let country: string = "America";
console.log(`Hi there, my name is ${name1}. I'm ${age} years old and I live in ${city}, ${country}.`);
輸出：
Hi there, my name is Jack. I'm 21 years old and I live in New York, America.
TypeScript 中算術表示式的字串插值
TypeScript 允許在字串插值中處理算術邏輯表示式。
字串中的邏輯表示式示例：
const x: number = 10;
const y: number = 7;
console.log(`The sum of two numbers ${x} and ${y} is = ${x+y}.`);
輸出：
The sum of two numbers 10 and 7 is = 17.
型別為 number 的變數 x 和 y 用於字串中的其他表示式。佔位符 ${x+y} 計算 x 和 y 的加法。
我們可以計算操作並將其儲存在另一個變數中並使用字串中的變數，而不是計算字串中的操作。
看看下面的程式碼來理解這個概念：
const x: number = 7;
const y: number = 11;
const sum: number = x+y;
console.log(`The sum of two numbers ${x} and ${y} is = ${sum}.`);
輸出：
The sum of two numbers 7 and 11 is 18.
另一個具有多個算術表示式的示例：
const x: number = 10;
const y: number = 5;
const addition: number = x+y;
const subtraction: number = x-y;
const multiplication: number = x*y;
const division: number = x/y;
console.log(`The two numbers are ${x} and ${y}. The Addition = ${addition} Subtraction= ${subtraction} Multiplication = ${multiplication} Division = ${division} of the two numbers is computed.`);
輸出：
The two numbers are 10 and 5. The Addition = 15 Subtraction= 5 Multiplication = 50 Division = 2 of the two numbers is computed.
上面的例子顯示了這兩個數字的基本算術計算。執行一系列操作，並使用字串插值在單個字串中使用結果值。
static 字串現在使用變數。使用者現在可以更改變數的值來更新語句，而不是再次為不同的變數值重寫整個程式碼來列印結果輸出語句。
TypeScript 中條件表示式的字串插值
條件表示式有兩個條件，true 或 false。條件語句以這種方式作為（條件）？真假。
首先是我們要計算的表示式。在問號 ? 之後有兩個條件，第一個是 true，冒號:後面的另一個是 false。
字串中的條件表示式示例：
const x: number = 12;
const y: number = 13;
const sum: number = a+b;
console.log(`The sum-total of ${a} and ${b} is = ${(sum==25) ? 'Twenty Five' : 'Addition Error'}.`);
輸出：
The sum-total of 12 and 13 is = Twenty Five.
有型別為 number 的 a 和 b 變數。在字串中，我們有一個條件運算子來檢查總和是否等於 25。
讓我們舉一個條件為 false 的例子：
const x: number = 12;
console.log(`The number is x = ${x}, which is ${(x==13) ? 'equal to 13' : 'not equal to 13'}.`);
輸出：
The number is x = 12, which is not equal to 13.
條件結果為 false。因此，它被列印為不等於 13。
TypeScript 中字串內建方法/函式的字串插值
TypeScript 允許在字串插值中處理內建的字串方法/函式。
使用字串的單個內建函式 length 的示例：
let name1: string = "John";
console.log(`The name ${name1} has ${name1.length} alphabets in his name.`);
輸出：
The name John has 4 alphabets in his name.
length 函式計算字串的字元數。
讓我們再舉一個例子：
let name1: string = "John Nash";
console.log(`The name ${name1} has ${name1.length} characters.`);
輸出：
The name John Nash has 9 characters.
上面的輸出顯示變數 name 有九個字元。任何寫在字串中的東西都被認為是一個字元，包括空格' '。
使用內建函式 slice() 的示例：
let name1: string = "John Nash";
console.log(`The first name is ${name1.slice(0,4)} and the last name is ${name1.slice(5,9)}.`);
輸出：
The first name is John and the last name is Nash.
slice() 函式需要兩個引數。第一個是起點，另一個是終點。
現在讓我們以字串的多個內建函式為例：
let name1: string = "John Nash";
let firstname: string = name1.slice(0,4);
let lastname: string = name1.slice(5,9);
console.log(`The first name ${firstname.toUpperCase()} is in capital alphabets and the last name ${lastname.toLowerCase()} is in small alphabets.`);
輸出：
The first name `JOHN` is in capital alphabets, and the last name `nash` is in small alphabets.
有兩個函式 toUpperCase() 和 toLowerCase() 分別將字串更改為大寫字母和小寫字母。
TypeScript 中自定義方法/函式的字串插值
TypeScript 允許對自定義函式進行字串插值。自定義函式是使用者建立的函式。
簡單自定義函式示例：
function sum(x: number, y: number): number {
return x+y;
};
console.log(`The sum of two numbers is = ${sum(5,7)}.`);
輸出：
The sum of two numbers is = 12;
上面的例子顯示了一個自定義函式 sum()，它帶有兩個引數 x 和 y 型別 number 在一個字串中使用。
示例 2：
function areaOfCircle(radius: number): number {
let area: number = 3.14 * radius * radius;
return area;
};
console.log(`The area of circle is = ${areaOfCircle(4)}.`);
輸出：
The area of circle is = 50.24.
自定義函式是 areaOfCircle()，它需要一個引數 radius。該函式返回變數 area。
Maisam is a highly skilled and motivated Data Scientist. He has over 4 years of experience with Python programming language. He loves solving complex problems and sharing his results on the internet.
LinkedIn