web-dev-qa-db-fra.com

Comment se déplacer, la propriété n'existe pas sur 'Object'

Je suis nouveau sur TypeScript, et je ne sais pas comment formuler cette question.

J'ai besoin d'accéder à deux propriétés "possibles" sur un objet qui est passé dans le constructeur. Je sais que je manque quelques contrôles pour voir s'ils sont définis, mais TypeScript me lance un message "La propriété n'existe pas sur" Objet ". Le message apparaît sur les retours sélecteur et modèle.

class View {
    public options:Object = {};

   constructor(options:Object) {
       this.options = options;
   }

   selector ():string {
       return this.options.selector;
   }   

   template ():string {
       return this.options.template;
   }   

   render ():void {

   }   
}

Je suis sûr que c'est assez simple, mais TypeScript est nouveau pour moi.

objecttypescript
49
Eric Harms

Si vous utilisez le type any à la place de Object, vous pouvez accéder à n'importe quelle propriété sans erreur de compilation.

Cependant, je conseillerais de créer une interface qui marque les propriétés possibles pour cet objet:

interface Options {
  selector?: string
  template?: string
}

Puisque tous les champs utilisent ?:, cela signifie qu’ils pourraient être ou ne pas être là. Donc ça marche:

function doStuff(o: Options) {
  //...
}

doStuff({}) // empty object
doStuff({ selector: "foo" }) // just one of the possible properties
doStuff({ selector: "foo", template: "bar" }) // all props

Si quelque chose vient de javascript, vous pouvez faire quelque chose comme ceci:

import isObject from 'lodash/isObject'

const myOptions: Options = isObject(somethingFromJS) // if an object
    ? (<Options> somethingFromJS) // cast it
    : {} // else create an empty object

doStuff(myOptions) // this works now

Bien sûr, cette solution ne fonctionne comme prévu que si vous n'êtes pas sûr de la présence d'une propriété qui n'est pas de son type.

58
Balázs Édes

Si vous ne souhaitez pas modifier le type ou créer une interface, vous pouvez également utiliser cette syntaxe pour accéder à des propriétés inconnues:

selector ():string {
    return this.options["selector"];
}   

template ():string {
    return this.options["template"];
}
16
John Montgomery