📜  json 到对象 typescript (1)

📅  最后修改于: 2023-12-03 15:32:25.096000             🧑  作者: Mango

将 JSON 转换为 TypeScript 对象

在使用 TypeScript 进行项目开发的过程中,常常需要将 JSON 数据转换为 TypeScript 对象。本文将介绍几种方法,让你快速地实现这个功能。

使用 interface 转换 JSON

我们可以使用 interface 来定义一个 TypeScript 对象,然后将 JSON 数据和这个 interface 结合起来,从而生成一个 TypeScript 对象。

interface User {
  name: string;
  age: number;
  email: string;
}

const jsonString = '{"name": "John", "age": 30, "email": "john@example.com"}';
const userObject: User = JSON.parse(jsonString);

console.log(userObject);

这段代码将会输出以下结果:

{ name: 'John', age: 30, email: 'john@example.com' }
使用 class 转换 JSON

我们也可以使用 class 来定义一个 TypeScript 对象,然后将 JSON 数据和这个 class 结合起来,从而生成一个 TypeScript 对象。

class User {
  name: string;
  age: number;
  email: string;

  constructor(name: string, age: number, email: string) {
    this.name = name;
    this.age = age;
    this.email = email;
  }
}

const jsonString = '{"name": "John", "age": 30, "email": "john@example.com"}';
const userObject: User = JSON.parse(jsonString, (key, value) => {
  if (key === '') {
    return new User(value.name, value.age, value.email);
  }
  return value;
});

console.log(userObject);

这段代码将会输出以下结果:

User { name: 'John', age: 30, email: 'john@example.com' }
使用库转换 JSON

同时,我们也可以使用第三方库将 JSON 数据转换为 TypeScript 对象。目前较为流行的库有 class-transformerjson2typescript 等。

import { plainToClass } from 'class-transformer';

class User {
  name: string;
  age: number;
  email: string;

  constructor(name: string, age: number, email: string) {
    this.name = name;
    this.age = age;
    this.email = email;
  }
}

const jsonString = '{"name": "John", "age": 30, "email": "john@example.com"}';
const userObject: User = plainToClass(User, JSON.parse(jsonString));

console.log(userObject);

这段代码将会输出以下结果:

User { name: 'John', age: 30, email: 'john@example.com' }
总结

以上就是将 JSON 转换为 TypeScript 对象的几种方法。我们可以根据自己的实际需求进行选择,让 TypeScript 进一步提高开发效率。