Jak w prosty sposób utworzyć silnie typowany obiekt z anonimowego obiektu w TypeScript?

Question

Mam niektóre JSON zawierające anonimowe obiekty przychodzące do mojego klienta. Czy istnieje jakiś wbudowany mechanizm lub biblioteka zewnętrzna do konwersji tych anonimowych obiektów w mocno typowane obiekty TypeScript? Czy jest coś takiego jak AutoMapper do robienia tego?

Moje obiekty są obiektami złożonymi, o złożonych typach jako właściwościach.

Answer 1

Trochę przykładowe dane i umieścić ją w .TS pliku:

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

Teraz musisz yourFile.d.ts:

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

Wymień declare var people: z interface Person, usunąć bieżący [] i (opcjonalnie) usuwają cytaty:

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

Answer 2

Ostatnio stworzyłem implementację AutoMappera w TypeScript/JavaScript dokładnie dla tego scenariusza. Umieściłem kod na GitHub (AutoMapperTS). Możesz także korzystać z biblioteki bezpośrednio, korzystając z pakietu NPM automapper-ts lub pakietu altanek automapper-ts.

Biblioteka jest prawie w pełni udokumentowana. Co więcej, sporo testów jednostkowych Jasmine jest już dostępnych (zasięg kodu przekracza 90%). Powinny zapewnić ci pewne wyjaśnienie.

Mam nadzieję, że ta biblioteka będzie pasować do Twoich potrzeb. Jeśli masz jakieś pytania i/lub uwagi, nie wahaj się skontaktować ze mną!

Szczęśliwe kodowanie!

Answer 3

Szukałem łatwego sposobu konwersji danych JSON z usługi internetowej na interfejs. Nie znalazłem tego, czego potrzebuję, ale oto moje rozwiązanie. Zauważyłem, że dodałem interfejs "Pet" i dodałem kolejnego zwierzaka do twojego jsona. Musiał również określić anonimowy obiekt jako "dowolny". Możesz wyciąć/wkleić to pole do TypeScript (http://www.typescriptlang.org/play/index.html), aby zobaczyć wyniki. Mam nadzieję że to pomoże.

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);