はじめに
こんにちは、運動通信社でバックエンドメインに携わっている Takeya です。
フロントエンドもちょくちょく実装してます。
今回はES6の書式でよく忘れるのでメモしておきたいと思います。
背景
当時の実装方針や歴史的な経緯もあって、ライブ配信ページの定数宣言クラスがこんな感じになってました。
class Config {
static get BEFORE() {
return 0;
}
static get PLAYING() {
return 1;
}
static get END() {
return 2;
}
// ... 略 (ライブ配信状態と関係ない各種定数が並列に書かれてる)
}
この3つはライブ配信状態を表している定数なので、グルーピングして LIVE_STATUS.BEFORE って参照したいですね。
結論
今回に関しては、なんのことはなく、定数っぽいキー名にしたオブジェクトを返せばいいかなと。
static get LIVE_STATUS() {
return {
BEFORE: 0,
PLAYING: 1,
END: 2,
};
}
これで Config.LIVE_STATUS.BEFORE で参照できます。
(※Javaとかなら enum で解決な気がしますが、JavaScriptには enum がないです。
Symbol を使えば enum っぽくできるみたいですが、今回はそこまで考えが至らず
)
理想はどうすべきなのか?
おそらく理想は、クラス設計を見直して、あるべきクラスに定数を移管する、のがいいのかなと思います。(Javaっぽく考えると LIVE_STATUS 自体を ValueObject としてクラス化すべきな気がします)
しかしながら、
- 結構規模があるので設計見直しは工数的に現実的でない。
- 一部のライブ配信ページは Vue.js に移行し始めているので、Vueとの相性を考えた設計を検討した方が良さそう。
- ちょっと可読性が気になったという話なので、手軽な修正で可読性が上がればOK。
と思って今回の実装を落とし所にしました。
今回の落とし所だと、 jsdoc でObject型の中身の型を表現できないみたいで、Lint系ツールなど型チェックには弊害があるかもしれません。
リファクタリングは工数(納期)とできることのバランスをとっていくのが難しいところです。
今回は非常にちょっとした話でしたが、少しずつリファクタリングを進めています、っていう一例でした。
おまけ
enum に関して、
TypeScriptなら enum をサポートしてたので軽く調べると、 enum じゃなくて union 型を使おう、ってなってるようです。
色々クセがありますね。。。