javascript - TypeScript'te API verilerini DTO (Veri Transfer Nesnesi) olarak nasıl dönüştürürsünüz

Aşağıdaki gibi bir araç dizim var.

export const fetchDataFromApi = () => {
  return [
    { vehicleId: 1, vehicleType: 'car', seats: 4, wheelType: 'summer', updatedAt: new Date().toISOString },
    { vehicleId: 2, vehicleType: 'plane', seats: 200, maxAltitude: 8000, updatedAt: new Date().toISOString },
    { vehicleId: 3, vehicleType: 'train', seats: 1200, railType: 'whatever', updatedAt: new Date().toISOString },
  ];
};

Araç, Araba, Uçak ve Tren sınıflarını oluşturdum. Ama emin değilim, bunlar aynı zamanda Arayüz de olabilir mi.

Bu API yanıtı, yanıtın türünü tanımlayan ve yanıtın DTO türüne dönüştürülmesini sağlayan bir DTO ile işlenmelidir.

Peki verileri nasıl tipli bir DTO'ya dönüştürebilirim? Aşağıda sınıf tanımlarım var ama nasıl uygulayacağım konusunda emin değilim..

class Vehicle {
      vehicleId: number;
      vehicleType: string;
      seats: number;
      updatedAt: string;

      constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string) {
        this.vehicleId = vehicleId;
        this.vehicleType = vehicleType;
        this.seats = seats;
        this.updatedAt = updatedAt;
      }
    }

    class Car extends Vehicle {
      wheelType: string;

      constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string, wheelType: string) {
        super(vehicleId, vehicleType, seats, updatedAt);
        this.wheelType = wheelType;
      }
    }

    class Plane extends Vehicle {
      maxAltitude: number;
      constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string, maxAltitude: number) {
        super(vehicleId, vehicleType, seats, updatedAt);
        this.maxAltitude = maxAltitude;
      }
    }

    class Train extends Vehicle {
      railType: string;
      constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string, railType: string) {
        super(vehicleId, vehicleType, seats, updatedAt);
        this.railType = railType;
      }
    }

Cevap #1

Veri setini dönüştürmek için sadece bir eşleyici oluşturmanız gerekiyor.

const fetchDataFromApi = (): Vehicle[] => {
    return [
      { vehicleId: 1, vehicleType: 'car', seats: 4, wheelType: 'summer', updatedAt: new Date().toISOString },
      { vehicleId: 2, vehicleType: 'plane', seats: 200, maxAltitude: 8000, updatedAt: new Date().toISOString },
      { vehicleId: 3, vehicleType: 'train', seats: 1200, railType: 'whatever', updatedAt: new Date().toISOString },
    ];
  };
  
  class Vehicle {
        vehicleId: number;
        vehicleType: string;
        seats: number;
        updatedAt: string;
  
        constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string) {
          this.vehicleId = vehicleId;
          this.vehicleType = vehicleType;
          this.seats = seats;
          this.updatedAt = updatedAt;
        }
      }
  
      class Car extends Vehicle {
        wheelType: string;
  
        constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string, wheelType: string) {
          super(vehicleId, vehicleType, seats, updatedAt);
          this.wheelType = wheelType;
        }
      }
  
      class Plane extends Vehicle {
        maxAltitude: number;
        constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string, maxAltitude: number) {
          super(vehicleId, vehicleType, seats, updatedAt);
          this.maxAltitude = maxAltitude;
        }
      }
  
      class Train extends Vehicle {
        railType: string;
        constructor(vehicleId: number, vehicleType: string, seats: number, updatedAt: string, railType: string) {
          super(vehicleId, vehicleType, seats, updatedAt);
          this.railType = railType;
        }
      }
  
  
  const vehicleMapper = (vehicle: Vehicle) => {
    const {vehicleId, vehicleType, seats, updatedAt} = vehicle;
    switch(vehicle.vehicleType) {
      case 'car':
        const {wheelType} = vehicle as Car;
        return new Car(vehicleId, vehicleType, seats, updatedAt, wheelType);
      case 'plane':
        const {maxAltitude} = vehicle as Plane;
        return new Plane(vehicleId, vehicleType, seats, updatedAt, maxAltitude);
      case 'train':
        const {railType} = vehicle as Train;
        return new Train(vehicleId, vehicleType, seats, updatedAt, railType);
      default:
        return new Vehicle(vehicleId, vehicleType, seats, updatedAt);
    }
  }



const data = fetchDataFromApi();
const vehicles = data.map(vehicleMapper);