Object.assign将日期字符串赋值给模型Date类型未报错问题咨询

哈哈，这个坑我之前踩过！其实这完全是TypeScript的“编译时类型检查”特性在作祟，咱们掰碎了说：

1. TypeScript的类型检查只在编译阶段生效 #

TypeScript本质上是JavaScript的超集，编译成JS之后所有的类型注解都会被完全擦除。也就是说，运行时的JS根本不知道你原本定义的noteDate是Date类型——它只认实际赋值的内容。所以你把字符串塞进去，JS只会老老实实存字符串，不会有任何报错。

那为啥编译阶段也没提示？大概率是这两个原因之一：

• 你的HttpClient请求没指定泛型，返回的是any类型：比如this.http.get('/api/data')，TS对any类型完全不做类型校验，怎么赋值都不会拦你。
• 你的tsconfig.json没开严格模式：如果strict设为false，或者noImplicitAny、strictNullChecks这些开关没打开，TS的类型检查会变得非常宽松，就算类型不匹配也可能不报错。

2. 怎么正确把日期字符串转成Date对象？ #

想要真正让Date字段存的是Date对象而不是字符串，得手动做转换，这里给你几个常用方案：

方案一：赋值时手动转换 #

在拿到接口返回数据后，逐个把日期字符串转成Date：

this.httpClient.get('/api/data').subscribe(response => {
  const data: Data = {
    ...response,
    noteDate: new Date(response.noteDate),
    maturityDate: new Date(response.maturityDate),
    disburseDate: new Date(response.disburseDate)
  };
});

方案二：用类的构造函数自动转换 #

给你的Data类加个构造函数，接收原始数据并自动处理日期字段：

export class Data {
  purpose: string = null;
  percentSold: number = null;
  originalTerm: number = null;
  originatedBy: string = null;
  noteDate: Date = null;
  productType: string = null;
  maturityDate: Date = null;
  noteAmount: number = null;
  disburseDate: Date = null;
  interestRate: number = null;

  constructor(rawData: Partial<Data>) {
    // 先把所有字段赋值过来
    Object.assign(this, rawData);
    // 单独转换日期字段
    this.noteDate = rawData.noteDate ? new Date(rawData.noteDate) : null;
    this.maturityDate = rawData.maturityDate ? new Date(rawData.maturityDate) : null;
    this.disburseDate = rawData.disburseDate ? new Date(rawData.disburseDate) : null;
  }
}

// 使用时直接实例化
this.httpClient.get<Partial<Data>>('/api/data').subscribe(raw => {
  const data = new Data(raw);
  // 现在date字段都是正经的Date对象啦
});

方案三：用Http拦截器全局处理 #

如果你的项目里很多接口都返回日期字符串，可以写个Http拦截器，自动把响应里的日期字符串转成Date对象，一劳永逸。

内容的提问来源于stack exchange，提问作者Shaun Chua