☃️

残余プロパティの命名は 「...rest」 に統一しませんか?

2024/12/18に公開

はじめに

今回はタイトルにあるように、命名に関する話を簡単に書こうと思います。JavaScriptやTypeScriptには、分割代入という構文があります。これはとても便利で、多くの開発現場で利用されているでしょう。例えば、Reactコンポーネントでpropsを扱う際によく用いられるのがオブジェクトの分割代入です。特定のプロパティ(例えばhoge)だけを抜き出し、残りのプロパティをまとめて扱いたいときに、以下のようなコードを書くことができます。

const MyComponent = (props) => {
    const { hoge, ...rest } = props;
    return <SampleUi {...rest}>sample</SampleUI>;
};

ここで...restはhoge以外のすべてのプロパティをrestオブジェクトとして集約する構文です。
例えば、propsが { hoge: 'HOGE', fuga: 'FUGA', piyo: 'PIYO' } であれば、 restには { fuga: 'FUGA', piyo: 'PIYO' } が入ることになります。

統一する必要性

結論から言えば、統一されていなくても大きな問題ではないですが"残りのProps"を示すために、どんな単語を使っていても、ある程度の開発経験があればその意味を理解することは容易でしょう。
しかし、分割代入に馴染みのない開発者や、ジュニアなメンバーが多い環境であれば、表現が統一されていることで理解がスムーズになった経験があるのでオススメです。

強いこだわりがなければ ...rest がよさそう

...rest は短く、直感的で、慣用的に使われている表現だと思います。MDNのサンプルコードでも ...rest が利用されています。
特別な理由がない限り、 ...rest を用いることでチーム全員がスムーズにコードを理解でき、可読性が向上することでしょう。

他の命名候補

これまで開発してきたプロジェクトでは、以下のような表現を目にすることがありましたので、簡単に一覧にしてみました。
※検索結果は特に言語やプロジェクトによるフィルタはしておらず、参考程度です。

変数名 意味 検索結果
...rest 「他のもの」を意味し、最も一般的な慣用句 1.3M
...others 「他のもの」を意味し、restと同様の役割が直感的 111K
...remaining 「残り」を更に明示的に表現できますが、若干長い 62.7K
...restProps propsであることを強調したい場合に有効 243K
...otherProps 同上 161K

まとめ

コードの品質において"可読性"という要素は非常に重要なものだと思っています。可読性が高ければ、容易に理解できますし、開発速度を向上させる要因になっていると思います。
「たかが命名。されど命名。」という精神で、分割代入で余ったプロパティ(残余プロパティ)の変数名を統一してみてはいかがでしょうか。特にこだわりがなければ ...rest を選ぶことで、理解しやすいコードになることでしょう!

Discussion