typescript - วิธีแก้ปัญหา property ไม่อยู่บน 'Object'

ฉันเป็นมือใหม่กับ Typescript และไม่แน่ใจว่าควรตั้งคำถามนี้อย่างไร

ฉันจำเป็นต้องเข้าถึงคุณสมบัติสองอย่างที่เป็น "ไปได้" บนวัตถุที่ถูกส่งเข้ามาในตัวสร้าง ฉันรู้ว่ากำลังขาดการตรวจสอบบางอย่างเพื่อดูว่าพวกมันถูกกำหนดหรือไม่ แต่ Typescript กำลังแสดงข้อความ "Property does not exist on 'Object'" ข้อความนี้ปรากฏบนการคืนค่า selector และ template

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

ถ้ามีบางอย่างมาจากจาวาสคริปต์ คุณสามารถทำบางอย่างแบบนี้ได้:

import isObject from 'lodash/isObject'

const myOptions: Options = isObject(somethingFromJS) // if an object
    ? (somethingFromJS as Options) // 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"];
}