526互联

ts中interface转换class

发布时间 2023-04-25 14:14:30作者: 希0127

引

在 ts 中 interface 可以表示具体的一种数据结构，但当我们需要将 interface 转换成 class 时，直接使用 interface 的话，会导致一些问题，比如 interface 中的属性无法被继承，所以我们需要将 interface 转换成 class，这里介绍一种方法。

例

数据结构

interface IPerson {
  name: string;
  age: number;
}

class Person implements IPerson {
  name: string;
  age: number;
  getName(): string {
    return this.name;
  }
}

问题

当我们直接从网络获取到一份 json 的 string 时候，我们需要将其转换成对应的数据结构，这里我们使用JSON.parse来将其转换成Person，但是直接调用 getName 方法是会报错的，因为JSON.parse返回的是一个IPerson，而不是Person，所以我们需要将其转换成Person。

//即使使用了类型断言，也是不行的
const person: Person = JSON.parse(jsonString);
person.getName(); // 报错

解决

我们可以使用Object.assign来将IPerson转换成Person

const person: IPerson = JSON.parse(jsonString);
const person2: Person = Object.assign(new Person(), person);
person2.getName(); // 正常