JavaScript 数组 join() 方法

JavaScript join() 语法

join() 是 JavaScript 数组的一个方法，它用于将数组所有元素根据 “指定分隔符” 来连接成一个字符串。

语法：

arr.join(separator)

说明：

join() 方法可以接收单个参数。

• separator（可选）：是一个字符串，用于连接数组元素。
  • 如果省略 separator 参数，则数组元素将用英文逗号 (,) 分隔。 separator 参数，则数组元素将用英文逗号 (,) 分隔。
  • 如果参数 separator 是一个空字符串 ("")，则所有元素之间将没有任何分隔符。

JavaScript join() 摘要

JavaScript join() 示例

接下来，我们通过几个简单的例子来讲解一下 JavaScript join() 方法是如何使用的。

示例 1：join() 基本用法

const arr = ["红", "绿", "蓝"];

const result1 = arr.join();
console.log(result1);

const result2 = arr.join("*");
console.log(result2);

const result3 = arr.join("AAA");
console.log(result3);

运行结果如下。

红,绿,蓝
红*绿*蓝
红AAA绿AAA蓝

分析：

如果想要使得元素之间是没有任何东西的，此时应该怎么办呢？请看下面例子。

示例 2：join() 的参数是空字符串（无缝连接）

const arr = ["红", "绿", "蓝"];
const result = arr.join("");
console.log(result);

运行结果如下。

红绿蓝

分析：

注意，join(" ") 和 join("") 是不一样的！前者两个引号之间是有空格的，所以表示用空格作为连接符来连接，而后者两个引号之间是没有空格的。

示例 3：join() 不带参数

const arr = ["红", "绿", "蓝"];
console.log(arr.join());
console.log(arr.toString());

运行结果如下。

红,绿,蓝
红,绿,蓝

分析：

如果 join() 方法不带任何参数，其结果与 toString() 方法的一样。

示例 4：join() 处理 null 和 undefined 元素

const arr = ["红", "绿", null, "蓝", undefined];
const result = arr.join("*");
console.log(result);

运行结果如下。

红*绿**蓝*

分析：

数组中的 null 和 undefined 元素在 join() 时会被转换为空字符串，不会产生 null 或 undefined 字样。

示例 5：join() 将单词组成句子

const arr = ["I", "love", "JavaScript", "and", "Python"];
const result = arr.join(" ");
console.log(result);

运行结果如下。

I love JavaScript and Python