Как обойти свойство не существует в "Объекте"

Я новичок в Typescript и не знаю, как сформулировать этот вопрос.

Мне нужно получить доступ к двум "возможным" свойствам объекта, который передается в конструкторе. Я знаю, что им не хватает некоторых проверок, чтобы определить, определены ли они, но Typescript выбрасывает мне "Свойство не существует в сообщении" Объект ". Сообщение появляется в селектор и шаблон.

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 {

   }   
}

Я уверен, что это довольно просто, но Typescript для меня новичок.

Ответ 1

Если вы используете тип any вместо Object, вы можете получить доступ к любому свойству без ошибок компиляции.

Однако я бы посоветовал создать интерфейс, который отмечает возможные свойства для этого объекта:

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

Поскольку все поля используют ?:, это означает, что они могут быть или не быть там. Итак, это работает:

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

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

Если что-то приходит из javascript, вы можете сделать что-то вроде этого:

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

Конечно, это решение работает только так, как ожидалось, если вы только не уверены в наличии свойства, а не его типа.

Ответ 2

Если вы не хотите изменять тип или создавать интерфейс, вы также можете использовать этот синтаксис для доступа к неизвестным свойствам:

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

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