【JavaScript】配列でも配列じゃなくてもワンライナーで配列にする

concat か flat を使う

配列かもしれないし、配列じゃないかもしれないし undefined かもしれない変数を必ず配列にします。

// undefined や null を許容したい場合
let array = [].concat(arrayOrSingle);
let array = [arrayOrSingle].flat();

// 0 や空文字を含む場合 (null, undefined 以外を許容)
let array = [].concat(arrayOrSingle ?? []);
let array = [arrayOrSingle ?? []].flat();

// 0 や空文字を除外する場合
let array = [].concat(arrayOrSingle || []);
let array = [arrayOrSingle || []].flat();

実行例

[].concat(null); // [null]
[].concat(null ?? []); // []
[].concat(0 ?? []); // [0]
[0 || []].flat(); // []
[[1, 2, 3] || []].flat(); // [1, 2, 3]

関数化しておけばいいのでは？

上記はどんな環境でも使えるテクニックとして紹介しました。
長期的に見れば、以下のような関数を実装して使うようにするのがいいと思います。

// null, undefined は空配列になる
const toArray = (arrayOrSingle) => {
  if (Array.isArray(arrayOrSingle)) {
    return arrayOrSingle;
  }
  return arrayOrSingle != null ? [arrayOrSingle] : [];
};

// null, undefined でも [null] のようになる
const toArrayNullable = (arrayOrSingle) => {
  return Array.isArray(arrayOrSingle) ? arrayOrSingle : [arrayOrSingle];
};

// falsy な値は空配列 になる
const toArrayIgnoreFalsy = (arrayOrSingle) => {
  if (Array.isArray(arrayOrSingle)) {
    return arrayOrSingle;
  }
  return arrayOrSingle ? [arrayOrSingle] : [];
};

あとがき

最初はChatGPTに記事を書いてもらおうと思ったけど、適度な分量にしてくれなかったりコードの例が冗長だったり微妙に気に入らなかったので結局全部自分で書きました。
今後は試しにメモを投げたりして記事構成やそれっぽい文章が出てきたら採用するぐらいの使い方にしようかと思いました。