配列.join() / 文字列.split()

// 配列の要素を区切り文字で連結して文字列にします。
var str = 配列.join(区切り文字);

// 文字列を区切り文字で分割して配列にします。
var arr = 文字列.split(区切り文字, 最大数);

// 配列を文字列に変換します。
var fruits = ["りんご", "みかん", "ぶどう"];
console.log(fruits.join(", ")); // 『りんご, みかん, ぶどう』と出力されます。
console.log(fruits.join("-")); // 『りんご-みかん-ぶどう』と出力されます。
console.log(fruits.join("")); // 『りんごみかんぶどう』と出力されます。区切り文字なしです。
console.log(fruits.join()); // 『りんご,みかん,ぶどう』と出力されます。省略時はカンマです。

// 文字列を配列に変換します。
var csv = "太郎,花子,次郎";
var names = csv.split(",");
console.log(names); // 『太郎,花子,次郎』と出力されます。配列です。

// 1文字ずつ分割します。
var chars = "Hello".split("");
console.log(chars); // 『H,e,l,l,o』と出力されます。

// 最大数を指定します。
var parts = "a-b-c-d-e".split("-", 3);
console.log(parts); // 『a,b,c』と出力されます。最初の3つだけです。

// joinとsplitを組み合わせて文字列を置換します。
var text = "私はりんごが好きです";
var replaced = text.split("りんご").join("みかん");
console.log(replaced); // 『私はみかんが好きです』と出力されます。

"りんご, みかん, ぶどう"   // join(", ")
"りんご-みかん-ぶどう"     // join("-")
"りんごみかんぶどう"       // join("")
"りんご,みかん,ぶどう"     // join()。省略時はカンマです。
["太郎", "花子", "次郎"]   // split(",")
["H", "e", "l", "l", "o"] // split("")
["a", "b", "c"]           // split("-", 3)
"私はみかんが好きです"     // splitとjoinの組み合わせ

『配列.join()』と『文字列.split()』は配列と文字列を相互に変換する対になるメソッドです。CSVデータの処理、パスの組み立て、単語の分割・結合など、文字列操作の基本としてさまざまな場面で活用されます。

『配列.join()』は配列の要素に『null』や『undefined』が含まれている場合、それらは空文字列として扱われます。区切り文字に空文字列を指定すると、すべての要素がそのまま連結されます。HTMLの生成では、配列に入れたタグ文字列を『join("")』で結合するテクニックがよく使われます。

『文字列.split()』の区切り文字には正規表現も指定できます。例えば『"a1b2c3".split(/[0-9]/)』はすべての数字で分割し、『["a", "b", "c", ""]』を返します。引数に空文字列を指定すると1文字ずつの配列になりますが、サロゲートペア（絵文字など）は正しく分割されないため注意が必要です。