TypeScript中类内部泛型参数覆盖外部自定义类型问题如何解决？

问题原因 #

类声明时的泛型占位符名称和外部定义的myType类型重名，类内部作用域会优先将myType识别为无明确属性定义的泛型参数，而非外部的自定义类型，导致访问属性时报错。

解决方案 #

• 方案1：如果你的类就是用来存储myType类型的元素，不需要泛型适配其他类型，直接去掉类的泛型声明即可：

// 原有自定义类型
type myType = {
  value1: string;
  value2: string;
}

// 直接继承指定了元素类型的Array
class MyTypeArray extends Array<myType> {
  testMethod() {
    const a: myType = { value1: "测试", value2: "示例" };
    console.log(a.value1); // 可正常访问，无报错
  }
}

• 方案2：如果你的类需要保留泛型能力适配多种类型，把泛型占位符改成其他不冲突的名称即可：

type myType = {
  value1: string;
  value2: string;
}

// 泛型参数用T这类通用名称，避免和已有类型重名
class CustomArray<T> extends Array<T> {
  testMethod() {
    // 此时myType会正确指向外部定义的自定义类型
    const a: myType = { value1: "测试", value2: "示例" };
    console.log(a.value1); // 可正常访问
  }
}

额外注意：你示例代码里还有两处语法问题：1. TypeScript类内部声明成员不能使用let关键字，类属性直接声明、方法内变量用let/const声明即可；2. 声明的变量需要先初始化赋值，再访问属性，否则会触发未初始化报错。

内容的提问来源于stack exchange，提问作者Ioana Nica