Как я могу легко создать строго типизированный объект из анонимного объекта в TypeScript?

Question

У меня есть JSON, содержащий анонимные объекты, идущие на мою клиентскую сторону. Есть ли встроенный механизм или внешняя библиотека для преобразования этих анонимных объектов в строго типизированные объекты TypeScript? Есть что-то вроде AutoMapper для этого?

Мои объекты сложны, со сложными типами свойств.

Answer 1

Получить некоторые образцы данных и поместить его в .ts файл:

var people = [ 
    { 
     "name": "bob", "height": 150, "pets": [{ "name": "spot", "species": "dog" }] 
    }, 
    { 
     "name": "jane", "height": 142, "pets": [{ "name": "lucy", "species": "cat" }] 
    } 
]; 

Run tsc --declaration yourFile.ts

Теперь вы будете иметь yourFile.d.ts:

declare var people: { 
    "name": string; 
    "height": number; 
    "pets": { 
     "name": string; 
     "species": string; 
    }[]; 
}[]; 

Заменить declare var people: с interface Person, удалить в конце [] и (необязательно) удалите котировки:

interface Person { 
    name: string; 
    height: number; 
    pets: { 
     name: string; 
     species: string; 
    }[]; 
} 

Answer 2

Недавно я создал реализацию AutoMapper в TypeScript/JavaScript именно для этого сценария. Я поместил код в GitHub (AutoMapperTS). Вы также можете использовать библиотеку напрямую, используя пакет NPM automapper-ts или пакет automapper-ts Bower.

Библиотека почти полностью задокументирована. Кроме того, уже достаточно много модульных тестов Jasmine (покрытие кода более 90%). Они должны предоставить вам некоторое объяснение необходимости.

Я надеюсь, что эта библиотека будет отвечать вашим потребностям. Если у вас есть какие-либо вопросы и/или замечания, пожалуйста, не стесняйтесь обращаться ко мне!

Счастливое кодирование!

Answer 3

Я искал простой способ конвертировать данные json из веб-службы в интерфейс. Не нашел то, что мне нужно, но вот мое решение. Заметил, что я добавил интерфейс «Pet» и добавил другого питомца к вашему json. Также необходимо было указать анонимный объект как «any». Вы можете вырезать/вставить это на детскую площадку TypeScript (http://www.typescriptlang.org/play/index.html), чтобы увидеть результаты. Надеюсь это поможет.

let header = document.createElement("div"); 
header.textContent = "Test"; 
document.body.appendChild(header); 

var people:any = [ 
    { 
     "name": "bob", "height": 150, "pets": [{ "name": "spot", "species": "dog" }, {"name" : "violet", "species": "shark"}] 
    }, 
    { 
     "name": "jane", "height": 142, "pets": [{ "name": "lucy", "species": "cat" }] 
    } 
]; 

interface Pet { 
    name: string; 
    species: string; 
} 
interface Person { 
    name: string; 
    height: number; 
    pets: Array<Pet> 
} 

class Foo { 
    convertToObject = (person: Person) => person; 
} 


var person = new Foo().convertToObject(people[0]); 

let div = document.createElement("div"); 
div.textContent = `hey ${person.name} I see you have ${person.pets.length} pet`; 
document.body.appendChild(div);