Gdybym chciał programowo przypisać właściwość do obiektu w JavaScript, zrobiłbym to w ten sposób:
var obj = {};
obj.prop = "value";
Ale w TypeScript powoduje to błąd:
Właściwość „prop” nie istnieje w przypadku wartości typu „{}”
Jak mam przypisać nową właściwość do obiektu w TypeScript?
typescript
Peter Olson
źródło
źródło
Odpowiedzi:
Można to określić
obj
jakoany
, ale to przeczy celowi używania maszynopisu.obj = {}
oznacza, żeobj
jestObject
. Oznaczenie go jakoany
nie ma sensu. Aby osiągnąć pożądaną spójność, interfejs można zdefiniować w następujący sposób.LUB, aby uczynić go kompaktowym:
LooseObject
może akceptować pola z dowolnym ciągiem jako kluczem iany
wpisać jako wartość.Prawdziwą elegancją tego rozwiązania jest to, że możesz zawrzeć w interfejsie bezpieczne pola.
źródło
LooseObject
może również wziąć błąd.Lub wszystko za jednym razem:
źródło
any
użyć tak wielu rzeczy, aby z niego skorzystać? Staje się dodatkowy szum w moim kodzie ..: /any
. TypeScript służy do wychwytywania (potencjalnych) błędów w czasie kompilacji. Jeśli użyjesz opcjiany
wyciszania błędów, tracisz moc pisania i równie dobrze możesz wrócić do czystej wersji JS.any
najlepiej używać tylko wtedy, gdy importujesz kod, dla którego nie możesz pisać definicji TS lub migrujesz swój kod z JS do TSZwykle stawiam
any
na drugą stronę,var foo:IFoo = <any>{};
więc coś takiego jest nadal bezpieczne:Alternatywnie możesz oznaczyć te właściwości jako opcjonalne:
Wypróbuj online
źródło
I still have <any>{
to nie skompilowałeś. TypeScriptvar foo: IFoo = {} as any
są preferowane. Stara składnia do rzutowania typów kolidowała z TSX (JSX z ifescript-ified).To rozwiązanie jest przydatne, gdy obiekt ma określony typ. Podobnie jak przy uzyskiwaniu obiektu do innego źródła.
źródło
Chociaż kompilator narzeka, powinien nadal wyświetlać go zgodnie z wymaganiami. Jednak to zadziała.
źródło
Jeszcze jedną opcją jest dostęp do właściwości jako kolekcji:
źródło
Object.assign(obj, {prop: "value"})
z ES6 / ES2015 również działa.Dziwi mnie, że żadna z odpowiedzi nie odwołuje się do Object.assign, ponieważ tej techniki używam za każdym razem, gdy myślę o „kompozycji” w JavaScript.
I działa zgodnie z oczekiwaniami w TypeScript:
Zalety
any
w ogóle używać tego typu&
przy deklarowaniu typuobjectWithAllProps
), co wyraźnie informuje, że komponujemy nowy typ w locie (tj. dynamicznie)Rzeczy, o których należy pamiętać
existingObject
pozostaje nietknięty, a zatem nie maemail
właściwości. Dla większości programistów w stylu funkcjonalnym jest to dobra rzecz, ponieważ wynikiem jest jedyna nowa zmiana).źródło
Możesz utworzyć nowy obiekt na podstawie starego obiektu za pomocą operatora rozkładania
TypeScript wywnioskuje wszystkie pola oryginalnego obiektu, a VSCode wykona autouzupełnianie itp.
źródło
Najprostsze będą następujące
źródło
Możliwe jest dodanie członka do istniejącego obiektu przez
źródło
Ponieważ nie możesz tego zrobić:
Jeśli twój kompilator TS i twój linter Cię nie ograniczają, możesz napisać to:
Jeśli Twój kompilator lub linter TS jest ścisły, inną odpowiedzią byłoby typecast:
źródło
Przechowuj każdą nową właściwość na dowolnym rodzaju obiektu, przypisując ją do „any”:
Później możesz go odzyskać, rzutując swój rozszerzony obiekt z powrotem na „dowolny”:
źródło
Aby zagwarantować, że typ jest
Object
(tj. Pary klucz-wartość ), użyj:źródło
Przypadek 1:
var car = {type: "BMW", model: "i8", color: "white"}; car['owner'] = "ibrahim"; // You can add a property:
Przypadek 2:
var car:any = {type: "BMW", model: "i8", color: "white"}; car.owner = "ibrahim"; // You can set a property: use any type
źródło
możesz użyć tego:
źródło
Możesz dodać tę deklarację, aby wyciszyć ostrzeżenia.
declare var obj: any;
źródło
Najlepszą praktyką jest bezpieczne pisanie, polecam:
źródło
Aby zachować poprzedni typ, tymczasowo rzutuj obiekt na dowolny
Nowa właściwość dynamiczna będzie dostępna tylko podczas używania rzutowania:
źródło
Oto specjalna wersja
Object.assign
, która automatycznie dostosowuje typ zmiennej przy każdej zmianie właściwości. Nie ma potrzeby stosowania dodatkowych zmiennych, asercji typów, typów jawnych ani kopii obiektów:Uwaga: Próbka wykorzystuje funkcje asercji TS 3.7 . Zwrot typu
assign
jestvoid
w przeciwieństwie doObject.assign
.źródło
Jeśli używasz maszynopisu, prawdopodobnie chcesz używać bezpieczeństwa typu; w takim przypadku nagi Obiekt i „dowolny” są przeciwwskazane.
Lepiej nie używać Object ani {}, ale niektóre nazwane typy; lub możesz używać interfejsu API z określonymi typami, które musisz rozszerzyć o własne pola. Znalazłem to do pracy:
źródło
dynamicznie przypisuj właściwości do obiektu w TypeScript.
Aby to zrobić, wystarczy użyć interfejsów maszynopisu w taki sposób:
możesz tego tak używać
źródło
attributes
pole wewnątrz,SomeClass
które powinno to naprawićpublic attributes: IType = {};
pastebin.com/3xnu0TnNSpróbuj tego:
Następnie użyj go
źródło
Jedynym rozwiązaniem, które jest w pełni bezpieczne dla typu, jest to , ale jest trochę niewygodne i zmusza cię do tworzenia wielu obiektów.
Jeśli musisz najpierw utworzyć pusty obiekt, wybierz jedno z tych dwóch rozwiązań. Pamiętaj, że za każdym razem
as
tracisz bezpieczeństwo.Bezpieczniejsze rozwiązanie
Rodzaj wewnątrz
object
jest bezpiecznygetObject
, co oznacza,object.a
że będzie tego typustring | undefined
Krótkie rozwiązanie
Rodzaj wewnątrz nie
object
jest bezpiecznygetObject
, co oznacza, żeobject.a
będzie taki sam,string
zanim jeszcze zostanie przypisany.źródło