マルチウィンドウ間でデータのやり取りをする際に、クラスに定義されたgetterの値（返り値）も含めてやり取りしたかったので、クラスに定義されたgetterを含めたオブジェクトの値を列挙する方法を調べた

基本的には以下を参考にした
https://qiita.com/yu0819ki/items/2bc8ba7e46d6ded63f4e

実装は以下のような感じ、
今回は、対象のクラスが他のクラスを継承している場合にそのクラスのgetterも含めて出力したかったので、ちょっと改造している

.js


const listupGetter = (obj) => {
    if (obj.constructor.name === 'Object') return [];
    let parentKeys = [];
    // 親クラスを持っている場合には、そのクラスのgetterのキーも取得する
    if (Object.getPrototypeOf(obj).constructor.name !== 'Object') {
      parentKeys =listupGetter(Object.getPrototypeOf(obj));
    }
    // プロトタイプ（クラス）取得
    const proto = Object.getPrototypeOf(obj);

    // Object.getOwnPropertyNames: プロトタイプ(クラス)で定義されているプロパティを全部取得
    const ownKeys = Object.getOwnPropertyNames(proto).filter((v) => {
      // そのうち、デスクリプタとして get があるものだけフィルタリング
      const descriptor = Object.getOwnPropertyDescriptor(proto, v);
      return descriptor.get instanceof Function && v !== '__proto__';
    });
    return [...parentKeys, ...ownKeys];
  }

  /**
   * クラスのGetterを含めた、オブジェクトのすべての値のキーの一覧を取得する
   * functionは無視される
   * @param obj 対象のobject
   * @return {(string)[]} オブジェクトのすべての値のキーの一覧
   */
const getPropertyList = (obj) => {
  return [...Object.keys(obj), ...listupGetter(obj)];
}

// 以下サンプルコード

class Polygon {
  name = "Polygon";
  get test (){
    return 1
  }
}

class Poly2 extends Polygon {
  get test2(){
    return 5
  }
}

const poly1 = new Polygon();
const poly2 = new Poly2();

const obj = {
  get test(){
    return aaa
  },
  ccc: 1
}


console.log(getPropertyList(obj));   // => Array ["test", "ccc"]
console.log(getPropertyList(poly1)); // => Array ["name", "test"]
console.log(getPropertyList(poly2)); // => Array ["name", "test", "test2"]

以上