JavaScript で Nullable な複数の文字列をカンマ区切り表示する

問題

Nullable な文字列の可変長引数を入力し、カンマ（,）区切りで並べて表示する関数 commaSeparator を実装したい。条件として値が '', undefined, null である場合、前後のカンマを適切に除去する必要がある。

例

const stringA = 'ラーメン🍜';
const stringB = '餃子🥟';
const stringC = 'エビチリ🍤';

const result1 = commaSeparator(stringA, stringB, stringC); // ラーメン🍜,餃子🥟,エビチリ🍤

const stringD = 'ハンバーガー🍔';
const stringE = null;
const stringF = 'ピザ🍕';

const result2 = commaSeparator(stringD, stringE, stringF); // ハンバーガー🍔,ピザ🍕

const stringG = null;
const stringH = 'ピーナッツ🥜';
const stringI = null;

const result3 = commaSeparator(stringG, stringH, stringI); // ピーナッツ🥜

回答例

色んな方法がありますが、if 文を用いないで実装する方法について説明します。結論から説明すると以下になります。

function commaSeparator(...nullableStrings) {
  return nullableStrings.filter(Boolean).join(',');
}

文字列の可変長引数ということであれば Boolean() でフィルタリングできます。もし、数字などが含まれる場合は 0 などが含まれないか注意が必要です。Boolean() の箇所は以下と同義なので、好みで書き換えてください。

nullableStrings.filter(v => v)

まとめ

タグのようなデータを列挙する場合などに必要になってくる、割と頻出な表現です。意外と同じような解説をしている記事がなかったので書きました。if 文を使わないシンプルな書き方をなるべく心がけたいと最近思っています。