Вывести имя интерфейса в консоль, как имена классов в инструментах Chrome Dev

Question

Я использую Angular v8 с TypeScript, и в настоящее время у меня есть куча избыточных классов, и становится все труднее синхронизировать их с изменениями с моими внутренними моделями. Решением этой проблемы является использование Swagger, и он работает как шарм.

Мой бэкэнд - C #, и я использую swagger code-gen для генерации моего клиентского интерфейса вместе с его моделями. Это довольно гладко, и мне действительно это нравится.

Однако я ищу способ заставить имена моделей печатать на консоли в инструментах разработчика, как они делают классы (с именем класса). Тем не менее, так как я самодовольно, кажется, генерирую только интерфейсы, а не классы, Chrome просто выплевывает его на консоль как объект JSON.

Есть ли способ получить инструменты разработчика Chrome для печати интерфейсаимя рядом с объектом?

class Person {
    public firstName: string;
  public lastName: string;
  constructor(first, last) {
    this.firstName = first;
    this.lastName = last;
  }
}

interface IPerson {
    firstName: string;
  lastName: string;
}

console.log(new Person('joe', 'dirt')); // friendly console message
console.log(<IPerson>{firstName: 'john', lastName: 'doe'}); // can't tell what type this is
console.log({firstName: 'john', lastName: 'doe'} as IPerson); // can't tell what type this is

https://jsfiddle.net/mswilson4040/yf8kowqn/

Я думаю, что нет 't так как интерфейсы на самом деле не заканчиваются так, как классы. Просто посмотреть, есть ли варианты, чтобы это произошло

Answer 1

Вы можете "маркировать" свои типы.

{ firstName: "something", lastName: "something" } имеет буквенный тип { firstName: string, lastName: string }, но в более общем случае просто имеет тип { [key: string]: string }. Если вам важно, измените ответ API или настройте способ получения данных в ваше приложение, чтобы «маркировать» объекты.

{ __type: "Person", firstName: "something", lastName: "something" }

Это также называется «». Номинальный набор текста"

Answer 2

Объект класса может быть напрямую переведен в JavaScript, и поэтому он имеет тип в консоли, как и любой другой класс. Интерфейс - это абстрактная вещь, которую JavaScript не может понять. Typescript переводит оба выражения в простой объект, который не имеет имени. Он не создает экземпляр класса, потому что нет никакой связи между классом и интерфейсом, который мог бы сказать машинописи, чтобы привести его к классу.

Answer 3

У вас есть два варианта. Сначала, как предлагается в другом ответе, добавьте какой-нибудь тег к каждому интерфейсу, который затем можно распечатать. Вы можете сделать это с помощью поля enum, которое имеет одно значение. Вы также можете использовать это, чтобы добавить номер версии к определению схемы, что может быть полезно при обновлении.

Во-вторых, вы можете поиграться с шаблоном Усы, используемым для кода поколения. Я никогда не делал этого, но инструкции здесь