W jaki sposób dynamicznie przypisać właściwości do obiektu w maszynie?

Albo wszystko naraz:

  var obj:any = {}
  obj.prop = 5;

Staram się umieścić anypo drugiej stronie czyli var foo:IFoo = <any>{};Więc coś w tym jest jeszcze typesafe:

interface IFoo{
    bar:string;
    baz:string;
    boo:string;     
}

// How I tend to intialize 
var foo:IFoo = <any>{};

foo.bar = "asdf";
foo.baz = "boo";
foo.boo = "boo";

// the following is an error, 
// so you haven't lost type safety
foo.bar = 123; 

Alternatywnie można oznaczyć te właściwości jako opcja:

interface IFoo{
    bar?:string;
    baz?:string;
    boo?:string;    
}

// Now your simple initialization works
var foo:IFoo = {};

Spróbuj go online

To rozwiązanie jest przydatne, gdy obiekt ma określonego typu. Podobnie jak przy uzyskiwaniu obiekt do innego źródła.

let user: User = new User();
(user as any).otherProperty = 'hello';
//user did not lose its type here.

Mimo, że kompilator narzeka powinien nadal wyjście to jak wymagać. Jednak będzie to działać.

var s = {};
s['prop'] = true;

Jeszcze jedna opcja to zrobić, aby uzyskać dostęp do własności jako zbiór:

var obj = {};
obj['prop'] = "value";

Aby zagwarantować, że typ jest Object(tzn par klucz-wartość ), należy:

const obj: {[x: string]: any} = {}
obj.prop = 'cool beans'

Najlepszą praktyką jest używać bezpiecznego pisania, polecam Ci:

interface customObject extends MyObject {
   newProp: string;
   newProp2: number;
}

• 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

Aby zachować swój poprzedni typ, tymczasowe oddać swój sprzeciw wobec każdego

  var obj = {}
  (<any>obj).prop = 5;

Nowa właściwość dynamiczny będzie dostępny tylko w przypadku korzystania z obsady:

  var a = obj.prop; ==> Will generate a compiler error
  var b = (<any>obj).prop; ==> Will assign 5 to b with no error;

Przechowywać każdy nowy obiekt na wszelkiego rodzaju obiektu przez rzutowania go „any”:

var extend = <any>myObject;
extend.NewProperty = anotherObject;

Później można je odzyskać, oddając swój wydłużony przedmiot z powrotem do „każdy”:

var extendedObject = <any>myObject;
var anotherObject = <AnotherObjectType>extendedObject.NewProperty;

Możesz dodać tę deklarację, aby wyciszyć ostrzeżenia.

declare var obj: any;

Dziwię się, że żadna z odpowiedzi odwoływać Object.assign ponieważ to technika używam ilekroć myślę o „kompozycja” w JavaScript.

I działa zgodnie z oczekiwaniami w maszynopisie:

interface IExisting {
    userName: string
}

interface INewStuff {
    email: string
}

const existingObject: IExisting = {
    userName: "jsmith"
}

const objectWithAllProps: IExisting & INewStuff = Object.assign({}, existingObject, {
    email: "jsmith@someplace.com"
})

console.log(objectWithAllProps.email); // jsmith@someplace.com

Zalety

• Typ bezpieczeństwa całej bo nie trzeba używać anytypu w ogóle
• wykorzystuje typ maszynopis za łączną (jak oznaczona &podczas deklarowania typ objectWithAllProps), który jasno komunikuje, że jesteśmy komponowania nowego typu on-the-fly (tj dynamicznie)

Rzeczy, aby zdawać sobie sprawę z

1. Object.assign ma własne unikalne aspekty (które są dobrze znane większości doświadczonych deweloperów JS), które powinny być brane pod uwagę podczas pisania maszynopis.
   • Może być stosowany w zmienny sposób, albo niezmienny sposób (I zademonstrować sposób niezmienny powyżej, co oznacza, że existingObjectpozostaje nietknięty, a zatem nie mają emailwłasności. Dla większości programistów funkcjonalnym stylu, że to dobra rzecz, ponieważ wynik jest jedynym nowym zmiany).
   • Object.assign działa najlepiej, gdy masz bardziej płaskich przedmiotów. Jeśli połączenie dwóch zagnieżdżonych obiektów, które zawierają właściwości zerowalne, może skończyć się nadpisywania wartości truthy z niezdefiniowane. Jeśli zwrócić uwagę na kolejność Object.assign argumentów, powinno być w porządku.

Jest możliwe, aby dodać element do istniejącego obiektu przez

1. poszerzenie typ (czytaj: extend / specjalizują interfejs)
2. cast oryginalnego obiektu do rozszerzonego typu
3. dodać element do obiektu

interface IEnhancedPromise<T> extends Promise<T> {
    sayHello(): void;
}

const p = Promise.resolve("Peter");

const enhancedPromise = p as IEnhancedPromise<string>;

enhancedPromise.sayHello = () => enhancedPromise.then(value => console.info("Hello " + value));

// eventually prints "Hello Peter"
enhancedPromise.sayHello();

Jeśli używasz maszynopis, prawdopodobnie chcesz użyć typu bezpieczeństwa; w takim przypadku nagi Przedmiot i „każdy” są counterindicated.

Lepiej nie używać przedmiot lub {}, ale niektóre nazwie typu; lub może być za pomocą interfejsu API z określonych typów, które trzeba rozszerzyć z własnych pól. Znalazłem to do pracy:

class Given { ... }  // API specified fields; or maybe it's just Object {}

interface PropAble extends Given {
    props?: string;  // you can cast any Given to this and set .props
    // '?' indicates that the field is optional
}
let g:Given = getTheGivenObject();
(g as PropAble).props = "value for my new field";

// to avoid constantly casting: 
let k:PropAble = getTheGivenObject();
k.props = "value for props";

dynamicznie przypisać właściwości do obiektu w maszynopisie.

Aby to zrobić wystarczy użyć interfejsów maszynopisu tak:

interface IValue {
    prop1: string;
    prop2: string;
}

interface IType {
    [code: string]: IValue;
}

można go używać tak

var obj: IType = {};
obj['code1'] = { 
                 prop1: 'prop 1 value', 
                 prop2: 'prop 2 value' 
               };

można użyć to:

this.model = Object.assign(this.model, { newProp: 0 });

Można utworzyć nowy obiekt na podstawie starego obiektu przy użyciu operatora spread

interface MyObject {
    prop1: string;
}

const myObj: MyObject = {
    prop1: 'foo',
}

const newObj = {
    ...myObj,
    prop2: 'bar',
}

console.log(newObj.prop2); // 'bar'

Maszynopis będzie wnioskować wszystkie pola oryginalnego obiektu i VSCode zrobi autouzupełnianie, etc.

Najprostszym będą następujące

const obj = <any>{};
obj.prop1 = "value";
obj.prop2 = "another value"

javascript:

myObj.myProperty = 1;

Maszynopis:

myObj['myProperty'] = 1;

Jeśli jesteś w stanie wykorzystać możliwości ES6 JavaScript, można użyć obliczone nazwy właściwości obsłużyć to bardzo prosty sposób:

var req = {id : 0123456};    
var response = {responses: {[req.id]: 'The 0123456 response message'}};

Przycisk [req.id] klucz obiekt ma wartość dynamiczną