创建对象时打字稿自动将数字转换为字符串答案

【问题标题】：Typescript autoconverting number to string when creating object创建对象时打字稿自动将数字转换为字符串
【发布时间】：2019-04-08 08:41:51
【问题描述】：

我有一个通用的函数，它接收字段（类属性）并从中创建一个 POST 请求。

代码是这样的：

public state: number;

updateField(field: string | number, name: string, team: boolean = true) {
  this.http.post('/update_key', {
        [path]: { [name]: field }
  })
}

这里的path 是一个具有类似/ipl_data/match_info/current_match 的firebase 路径的变量

我称之为this.updateField(this.state, 'state', false);

发送此请求时，请求正文的创建如下：

{
  "/ipl_data/match_info/current_match": {
    "state":"3"
  }          ^------ this should be a number since type was defined as number
}

有没有办法解决这种情况？

【问题讨论】：

[path]: { [name]: +field } +variable 会将其强制转换为数字
替换 updateField(field: string | number, name: string, team: boolean = true) ===> updateField(field: string | number, name: number, team: boolean = true) 或updateField(field: string | number, name: any, team: boolean = true)
@JacopoSciampi 我已经尝试过了，它可以工作。但正如您必须从函数签名中猜到的那样，该字段的联合类型为string | number。在这种情况下，硬转换为数字会起作用，但是如果我需要它作为字符串呢？当我在变量上定义类型时，这就是我希望 typescript 继续检查的内容？
在这些情况下，您确定将其作为字符串还是数字传递？

标签： angular typescript http http-post

【解决方案1】：

首先你的this.state === "3" 很有可能。检查this.state被赋值的地方。

这更像是一个“javascript”问题，而不是一个“打字稿”问题。您需要了解 typescript 对代码的运行时行为的影响零，它只在您的 IDE 中以及在您编译代码时起作用。

【讨论】：

我有一个输入元素绑定到状态为 [(ngModel)] 和 type="number"
AFAIK，带有原生 HTML 输入，即使 type="number"，input.value 仍然是字符串类型。这就是规范所说的。您需要确认，当设置type="number" 时，angular 会自动为您将字符串值转换为数字。
在大多数情况下，我在这个项目中主要使用了 Angular 的反应形式，他们将 FormControl 定义为 new FormControl(0, Validators.Required) 这样的特定类型，并且从未遇到过这样的问题。我猜 FormControl 提供了对类型的额外检查，以确保此类错误永远不会弹出。这可能是我第一次遇到这个错误的原因。
@IshanKhare 抱歉，我不是角度专家，对此无能为力。我只能告诉你这个问题与打字稿无关。

【解决方案2】：

我会尝试类似：

updateField(field: string | number, name: string, team: boolean = true) {
  this.http.post('/update_key', {
        [path]: { [name]: !isNaN(field) ? +field : field }
  })
}

【讨论】：

它似乎总是进入 else 条件。我仍然收到"3"
Typescript 始终将字段作为字符串传递。我用typeof 在函数顶部使用console.log 尝试了这个。它与我定义参数类型string | number 即联合类型的方式有关吗？所以它试图自动投射到最大的类型？
我更新了我的答案，所以如果field 是字符串中的一个数字，例如。 '3'，转换为数字，否则保持原样。在大多数情况下可能会做你想做的事......替代方法可以是向你的函数添加一个参数，明确告知field 是否是一个数字。