Typescript 可以推断由其基类的方法实例化的扩展类实例的类型吗?

2024-04-22

考虑以下 Typescript 片段:

class Animal {
  constructor(name: string) {
    this.name = name;
  }
  name: string;

  haveBaby(name: string): ?? return type ?? {
    return new this.constructor(name); // Error
  }
}

class Cat extends Animal {}
class Dog extends Animal {}
class Gerbil extends Animal {} // etc.

let sorachi = new Cat("Sorachi"); // a: Cat
let sorachiJr = a.haveBaby("Sorachi Jr."); // I want: sorachiJr: Cat

动物可以生孩子,并且孩子应该与父母是同一种类的动物,即应该是与父母同一类的实例。在这种情况下如何分配类型,以便 Typescript 知道sorachiJr: Cat?

上面的代码片段不起作用。线路return new this.constructor(name)产生错误[ts] Cannot use 'new' with an expression whose type lacks a call or construct signature.在 VS 代码中。我能够找到和理解的唯一解决方案是替换this.constructor(name) with (<any>this.constructor)(name) or (<any>this).constructor(name),但随后推断出的类型sorachiJr is any,也,而不是Cat。我尝试投射到typeof this而不是any,但出现错误[ts] Cannot find name 'this'.

我如何才能让 Typescript 相信生孩子是一项物种保护行动?


保留调用方法的类的类型很容易,我们只需使用多态this类型。为了让 ts 相信constructor将是一个构造函数,它需要一个string并返回一个与当前类相同类型的实例,需要类型断言

type AnimalConstructor<T extends Animal> = new (name: string) => T
class Animal {
    constructor(name: string) {
        this.name = name;
    }
    name: string;

    haveBaby(name: string): this  {
        return new (this.constructor as AnimalConstructor<this>)(name); 
    }
}

class Cat extends Animal {}
class Dog extends Animal {}
class Gerbil extends Animal {} // etc.

let sorachi = new Cat("Sorachi"); // a: Cat
let sorachiJr = sorachi.haveBaby("Sorachi Jr."); 

NoteTypescript 无法验证派生类构造函数只需要一个事实string参数,它可能需要更多或更少的参数。这使得这个构造函数不是类型安全的。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Typescript 可以推断由其基类的方法实例化的扩展类实例的类型吗? 的相关文章

  • 将变量分配给 document.getElementById().Innerhtml 不起作用

    请参阅下面的代码 var text yuppie kkkoseh watchdog var messageIndex 0 function looptext var MessageElement document getElementByI
  • 将 h1 元素的内容复制到剪贴板?

    所以 我做了一个翻译器 但效果不是很好 但无论如何 它正在工作 我想尝试添加一些可以复制结果的内容 有没有办法做到这一点 以下是我的代码 提前致谢 我知道有一种方法可以通过输入来完成此操作 但我不确定是否可以通过标题来完成 var myTe
  • 调用 DynamoDB 中的用户数据时渲染得太晚

    所以我试图从dynamoDB 我正在使用一个GraphQL API访问我的数据库 在提供的代码的注释部分中 我提到我已经尝试过users 1 friends map 它确实返回正确的朋友列表数组 但用户似乎直到朋友列表渲染后才被设置 我应该
  • 为什么显示后无法清除错误消息-axios-react

    第一个问题的背景 https stackoverflow com questions 72929201 react axios showing message to user 72929320 我正在展示使用localhost 3000 u
  • 如何在 ReactJs 中使用 Hooks useState 编写多行状态

    React 16 9 我知道这class component state class JustAnotherCounter extends Component state count 0 相当于使用Hooks useState functi
  • 使用 JavaScript 或 jQuery 设置文本框的最大长度

    我想用 JavaScript 或 jQuery 更改文本框的最大长度 我尝试了以下方法 但似乎没有帮助 var a document getElementsByTagName input for var i 0 i
  • 在 Angular 4 Reactive Forms 中提交时显示验证消息

    我正在使用 Angular 4 反应式表单 我想在用户单击 提交 创建帐户 按钮时显示验证错误消息 这是我正在使用的 HTML 和打字稿代码
  • Angular 2 - 检查图像 URL 是否有效或损坏

    我正在从 API 获取大量图像 URL 并将它们显示在 Angular 2 Web 应用程序中 有些 URL 已损坏 我想用本地存储在我的网络服务器上的默认图片替换它们 有人建议如何测试 url 并在状态代码 404 的情况下替换损坏的图像
  • Excel 到 JSON 的 JavaScript 代码?

    我想将excel表格数据转换为json 它必须是动态的 因此有一个上传按钮 用户可以在其中上传 Excel 工作表 然后将数据转换为 json 您能给我提供 javascript 代码吗 我尝试了 SheetJS 但无法弄清楚 我更喜欢直接
  • 使用 Typings 安装 React 相关类型定义时出现问题

    每当我尝试安装任何与 React 相关的包类型定义时 例如react boostrap fixed data table or react router尝试构建时出现以下类型的错误tsc Typings globals react boot
  • 如何在Redis中进行持久化存储?

    关闭redis服务器后 使用set存储的值被破坏 在这里我找到了使用持久性存储的方法 有人帮助我 如何使用javascript实现这一点 我想将客户端的一些值存储在 redis 数据库中 并且必须在其他客户端中使用该值 您需要配置 Redi
  • 最后一项具有不同类型的元组(首先从剩余元素开始)

    我有一个类型Foo那是一个Array可以包含任意数量的Bar元素 带有可选的最后一个Qux元素 以下是一些有效数据的示例 bar qux bar qux bar bar bar bar bar bar bar bar qux 无效数据示例
  • 向 ChartJS 数据点添加逗号

    我需要在 ChartJS 图表中的数字中添加逗号 前任 数据点可能是 1032 05 4334 75 8482 46 我需要它显示为 1 032 05 4 334 75 8 482 46 以下是包含当前代码的开发网站的链接 投资计算器 ww
  • 给出 HTML 和 Xpath 时突出显示

    给定 HTML 作为字符串 Xpath 和偏移量 我需要强调这个词 在下面的例子中我需要强调Child 1 HTML 文本 h2 Children h2 Joe has three kids br ul li a href Child 1
  • 查找数组中总和等于给定值的最小元素

    我试图找出数组中总和等于的最小元素 给定的输入 我尝试了几个输入总和 但只能找到一个 在第一种情况下配对 而我需要实现的不仅仅是一对 var arr 10 0 1 20 25 30 var sum 45 var newArr console
  • 启用 Chrome Headless 时 Dusk 测试失败

    我有一个 HTML 元素 该元素应该仅在第一页加载时显示 Javascript 设置 cookie 如果设置了 cookie 则不会显示该元素 PHP 检查 cookie 如果 cookie 存在 则不会呈现内容 我正在尝试为此进行 lar
  • 想要在 highcharts/highstock 中用鼠标滚轮移动 y 轴滚动条

    参考我想用鼠标滚轮移动 y 轴滚动条的问题 有什么办法可以做到吗 yAxis scrollbar enabled true showFull false 更新代码 下面是我更新的代码 var chart1 new Highcharts Ch
  • 谷歌距离矩阵 API

    我正在尝试获取direction in traffic 使用常规路线 API 不会返回该值 我发现有一个字段distancematrixapi 就是这样做的 当我从自己的机器上运行该代码时 该代码可以工作 但是一旦上线 我就会看到有关的错误
  • 将范围传递给 forEach

    我正在尝试使用回调方法addToCount而不是匿名函数forEach 但我无法访问this count其中 返回undefined function Words sentence this sentence sentence this c
  • 从 url 加载图像并绘制到 HTML5 Canvas

    我在从 javascript 中的 url 加载图像时遇到问题 下面的代码可以工作 但我不想从 html 加载图像 我想使用纯 JavaScript 从 url 加载图像 var c document getElementById myCa

随机推荐