TypeScript的类型声明中类型大小写的区别,js中的包装对象和自动装箱的理解

66 阅读2分钟

TS中类型大小写的区别

在JavaScript中的这些内置构造函数:Number、String、Boolean等,⽤于创建对应的包装对象,在⽇常开发时很少使⽤,在TypeScript中也是同理,所以在TypeScript中进⾏类型声明时,通常都是⽤⼩写的number、string、boolean等

类型声明

  • 使用 小写 类型声明的变量是 原始类型 (js引擎完成自动装箱),占内存小处理速度快(官方推荐)
  • 使用 大写 类型声明的变量是 包装对象 (由构造函数创建的实例),占内存大日常开发中很少使用

静态类型检查注意事项

  • 小写 的类型声明无法赋值 包装对象let str: string = new String('321')不能将类型“String”分配给类型“string”。“string”是基元(基础类型),但“String”是包装器对象

包装对象

  • 包装对象是由 构造函数 (Number、String、Boolean等)创建的 实例let str = new String('321')

自动装箱

MDN文档-原始数据类型和包装对象

原始数据类型(原始值、基础数据类型)是一种既非对象也无方法或属性的数据。当在原始值上访问属性时,JavaScript自动将值装入临时的包装对象中,并访问该对象上的属性,用完自动销毁。

  • 原始数据类型访问属性时js引擎会自动将变量值放入 临时包装对象 中并访问该对象下的属性,使用完自动销毁(无感知)。这一过程就是 自动装箱
// 原始类型字符串
let str = 'hello';
// 当访问str.length时,JavaScript引擎做了以下⼯作:
let size = (function() {
 // 1. ⾃动装箱:创建⼀个临时的String对象包装原始字符串
 let tempStringObject = new String(str);
 // 2. 访问String对象的length属性
 let lengthValue = tempStringObject.length;
 // 3. 销毁临时对象,返回⻓度值
 // (JavaScript引擎⾃动处理对象销毁,开发者⽆感知)
 return lengthValue;
})();
console.log(size); // 输出: 5