как сопоставить json с интерфейсом в angular7?

Question

Я использую angular7 и хочу сопоставить json своему интерфейсу. Мне нужна функция для сопоставления полей json с интерфейсом, а также если значение json несовместимо с inteeface, возвращает ошибку.

export interface User {
  firstName: string;
  lastName: string;
  phoneNumber: number;
};

const json = {
  firstName: 'Paresh',
  lastName: 'Gami',
  phoneNumber: 'num'
};

В моем примере тип номера телефона не может быть назначен интерфейс. Я хочу знать, как я могу управлять неверными данными

Answer 1

Как указано в @pascalpuetz, интерфейсы Typescript не существуют во время выполнения. TS будет скомпилирован в JS, и вы знаете, JS - это очень динамичный c язык, у объекта нет типа и его можно динамически изменить в любое время.

Если вам все еще нужно сопоставить , вам нужно добавить класс и сопоставить свойства:

export interface IUser {
  firstName: string;
  lastName: string;
  phoneNumber: number;
};

export class User implements IUser {
  firstName: string;
  lastName: string;
  phoneNumber: number;

  constructor(json: IUser) {
    this.firstName = json.firstName;
    this.lastName = json.lastName;
    this.phoneNumber = json.phoneNumber;
  }
}


const json = {
  firstName: 'Paresh',
  lastName: 'Gami',
  phoneNumber: 'num'
};

...

const result = new User(json);

В случае назначения определенного json, например:

const result = new User({
   firstName: 'Paresh',
   lastName: 'Gami',
   phoneNumber: 'num'
});

Typescript уже покажет ошибку, что тип собственности phoneNumber не подлежит передаче. Но в случае назначения анонимного json, например:

const json: IUser = await fetch('someurl');
const result = new User(json);

Это просто работает и во время выполнения (после соответствия JS) не будет учитывать, имеет ли json правильные свойства или нет.

JavaScript назначит свойства, которые есть у json. Таким образом, вам придется самостоятельно сравнить типы свойств.

constructor(json: IUser) {
    if (typeof json.firstName === 'string') {
        this.firstName = json.firstName;
    } else {
        throw 'Bad Data';
    }
    ...
}

Answer 2

export interface User {
  firstName: string;
  lastName: string;
  phoneNumber: number;
};

const json = {
  firstName: 'Paresh',
  lastName: 'Gami',
  phoneNumber: 'num'
};

var result:User = {};// initialize your result as an empty object of type "User"(interface)

затем

result = {
  firstName: json.firstName,
  lastName: json.lastName,
  phoneNumber: json.phnoeNumber
 }; // Map your json data to your result