TypeScript 中的裝箱和拆箱
裝箱和拆箱的概念對TypeScript至關重要。TypeScript 中的值型別會透過稱為裝箱的過程自動轉換為引用型別。換句話說,裝箱是指將值型別轉換為引用型別,而拆箱是指將引用型別轉換為值型別。這兩種技術用於在 TypeScript 中將值型別轉換為物件型別。
裝箱是將值型別包裝在物件型別中的過程。相反,拆箱是將物件型別解包回值型別。這兩種技術透過減少每次將值型別轉換為物件型別時分配的記憶體量來提高程式碼效能。
TypeScript 中的裝箱和拆箱指的是在將基本值傳遞給函式或從函式返回時處理它們的方式。當基本值傳遞給函式時,它會被裝箱,這意味著它會被轉換為物件。當值從函式返回時,物件會被拆箱,並且會返回基本值。這個過程是必要的,因為基本值不是面向物件的,必須將其轉換為函式才能對其進行操作。裝箱和拆箱可以提高 TypeScript 應用程式的效能和記憶體使用率。
現在讓我們詳細解釋這兩個主題。
TypeScript 中的裝箱
TypeScript 中的裝箱是指將基本資料型別(例如,數字、字串、布林值)的值轉換為相應包裝類的物件。TypeScript 具有用於基本資料型別的內建包裝類,例如 Number、String 和 Boolean。這些包裝類提供了可用於操作相應基本資料型別的有用方法和屬性。例如,Number 包裝類具有 toFixed()、toString() 和 valueOf() 等方法。裝箱是 TypeScript 中的一個重要概念,因為它允許在基本資料型別上使用否則不可用的方法。
語法
let variable_name: number = 12345 let boxing_variable_name: Object = variable_name // Boxing
在上面的語法中,我們可以看到型別為 number 的變數 variable_name 的值在裝箱過程中被轉換為物件型別變數。
示例
在此示例中,我們執行裝箱操作。我們聲明瞭一個名為 BoxingClass 的類並聲明瞭兩個變數。一個是數字,另一個是物件型別變數。我們聲明瞭一個名為 boxingMethod() 的方法,我們在其中執行裝箱操作。最後,我們控制檯輸出 my_object 變數的值。
class BoxingClass {
my_number: number = 123
my_object: Object
boxingMethod() {
this.my_object = this.my_number
console.log('Boxing Occurs for my_object variable')
}
}
let boxing_object = new BoxingClass()
boxing_object.boxingMethod()
console.log('my_object value: ', boxing_object.my_object)
編譯後,它將生成以下 JavaScript 程式碼 -
var BoxingClass = /** @class */ (function () {
function BoxingClass() {
this.my_number = 123;
}
BoxingClass.prototype.boxingMethod = function () {
this.my_object = this.my_number;
console.log('Boxing Occurs for my_object variable');
};
return BoxingClass;
}());
var boxing_object = new BoxingClass();
boxing_object.boxingMethod();
console.log('my_object value: ', boxing_object.my_object);
輸出
以上程式碼將產生以下輸出 -
Boxing Occurs for my_object variable my_object value: 123
TypeScript 中的拆箱
TypeScript 中的拆箱將具有複合資料型別(物件、陣列、元組、聯合等)的值轉換為更簡單的型別(字串、數字、布林值等)。它類似於其他程式語言中的“拆箱”,其中特定型別(如物件)的值被轉換為更簡單的型別,例如字串或數字。
在 TypeScript 中,拆箱是使用型別斷言語法(尖括號)來指定要拆箱的值的型別來完成的。例如,如果我們有一個型別為 any 的值,我們可以透過使用以下語法將其拆箱為 number 型別:<number> value。
語法
let variable_name: number = 12345 let boxing_variable_name: Object = variable_name // Boxing let unboxing_variable_name: number = <number>boxing_variable_name // Unboxing
在上面的語法中,我們可以看到型別為 number 的變數 variable_name 的值在裝箱過程中被轉換為物件型別變數,然後使用拆箱轉換回數字。
示例
在此示例中,我們執行裝箱和拆箱操作。我們聲明瞭一個名為 BoxingUnboxingClass 的類並聲明瞭三個變數:兩個是數字,另一個是物件型別變數。首先,我們使用 boxingMethod() 執行裝箱過程,然後使用 unboxingMethod() 執行拆箱。最後,我們控制檯輸出變數的值。
class BoxingUnboxingClass {
my_number: number = 123
boxing_variable: Object
unboxing_variable: number
boxingMethod() {
this.boxing_variable = this.my_number
console.log('Boxing Occurs!')
}
unboxingMethod() {
this.unboxing_variable = <number>this.boxing_variable
console.log('Unboxing Occurs!')
}
}
let boxing_unboxing_object = new BoxingUnboxingClass()
boxing_unboxing_object.boxingMethod()
boxing_unboxing_object.unboxingMethod()
console.log('boxing_variable value: ', boxing_unboxing_object.boxing_variable)
console.log(
'unboxing_variable value: ',
boxing_unboxing_object.unboxing_variable
)
編譯後,它將生成以下 JavaScript 程式碼 -
var BoxingUnboxingClass = /** @class */ (function () {
function BoxingUnboxingClass() {
this.my_number = 123;
}
BoxingUnboxingClass.prototype.boxingMethod = function () {
this.boxing_variable = this.my_number;
console.log('Boxing Occurs!');
};
BoxingUnboxingClass.prototype.unboxingMethod = function () {
this.unboxing_variable = this.boxing_variable;
console.log('Unboxing Occurs!');
};
return BoxingUnboxingClass;
}());
var boxing_unboxing_object = new BoxingUnboxingClass();
boxing_unboxing_object.boxingMethod();
boxing_unboxing_object.unboxingMethod();
console.log('boxing_variable value: ', boxing_unboxing_object.boxing_variable);
console.log('unboxing_variable value: ', boxing_unboxing_object.unboxing_variable);
輸出
以上程式碼將產生以下輸出 -
Boxing Occurs! Unboxing Occurs! boxing_variable value: 123 unboxing_variable value: 123
總而言之,TypeScript 中的裝箱和拆箱指的是在將基本值傳遞給函式或從函式返回時處理它們的方式。裝箱將基本值型別轉換為物件型別,而拆箱是將物件型別轉換回基本值型別的逆過程。這些技術透過減少每次將值型別轉換為物件型別時分配的記憶體量來提高程式碼效能。在 TypeScript 中,裝箱是透過將基本值分配給物件變數來完成的,而拆箱是使用型別斷言語法(尖括號)來指定要拆箱的值的型別來完成的。需要注意的是,基本值在棧中分配記憶體,而物件值在堆中分配記憶體。
資料結構
網路
關係型資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP