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 // 装箱
在上面的语法中，我们可以看到，在装箱过程中，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> value。
语法
let variable_name: number = 12345 let boxing_variable_name: Object = variable_name // Boxing let unboxing_variable_name: number = <number>boxing_variable_name // Unboxing
在上面的语法中，我们可以看到，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 中，装箱是通过将原始值分配给对象变量来完成的，而拆箱是使用类型断言语法(尖括号)来指定要拆箱的值的类型来完成的。需要注意的是，原始值的内存分配在堆栈上，而对象值的内存分配在堆上。
