Open1

TypeScriptでオブジェクトのプロパティを動的に扱う

mimimimi

typeof - JavaScript | MDN
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/typeof

TypeScript: Documentation - Keyof Type Operator
https://www.typescriptlang.org/docs/handbook/2/keyof-types.html

keyof typeof を連続して使って型定義とってきて、

Type Assertion(型アサーション) - TypeScript Deep Dive 日本語版
https://typescript-jp.gitbook.io/deep-dive/type-system/type-assertion

asで渡すと、keyとして使えるようになります。しゅごい。

type sampleType = {
 id: number
 name: string
 somethingKeyNameA: string
}
const sampleData: sampleType = {
  id: 1
  name: "mimi"
  somethingKeyNameA: "珈琲が大好き"
}

type ObjKey = keyof typeof sampleData

const myVar = "somethingKeyNameA" as ObjKey

console.log(data[myVar]); //  珈琲が大好き

nameとかだとあんまり恩恵無いけれど、somethingKeyNameA,somethingKeyNameBとかの命名規則のあるkeyで生成されるAPIのクエリ結果とかを展開するときに使ってみた。PHPで結構やるのでTypeScriptどうやるのかなーと思って調べたら理解するのに時間かかったのでメモ。いや未だに理解出来てない気がする。

参照

https://bobbyhadz.com/blog/typescript-access-object-property-dynamically