数组join的各种用法用法介绍(js数组join方法合集)

‘ 和 ‘

‘ 包围起来，最终得到了一个有序列表的 HTML 代码。

三、没有参数的情况

如果在调用 join() 方法时不传入任何参数，即使用默认参数逗号，会发生什么呢？下面是一个简单的例子：

const arr = ['apple', 'banana', 'orange'];
const result = arr.join();
console.log(result); // 输出：'apple,banana,orange'

在这个例子中，我们使用了默认参数逗号，将数组中的元素拼接成了一个字符串。但是需要注意的是，如果数组中的元素本身就是字符串类型，会发生什么情况呢？

const arr = ['apple', 'banana', 'orange'];
const strArr = ['hello', 'world'];
const result1 = arr.join();
const result2 = strArr.join();
console.log(result1); // 输出：'apple,banana,orange'
console.log(result2); // 输出：'hello,world'

在这个例子中，我们比较了一个由字符串组成的数组和一个由纯字符串组成的数组，发现使用默认参数逗号的情况下，结果是一样的。也就是说，join() 方法并不会将数组中的字符串元素拆分为字符再进行拼接，而是直接将它作为一个整体进行处理。

四、稀疏数组的处理

稀疏数组是指数组中包含 undefined 或者空元素的情况。使用 join() 方法时，会将这些空元素也算入到拼接的字符串中。下面是一个示例代码：

const arr = ['apple', , 'orange'];
const result = arr.join(',');
console.log(result); // 输出：'apple,,orange'

在这个例子中，我们定义了一个包含一个空元素的稀疏数组，使用逗号作为分隔符进行 join() 拼接后，空元素也被计入了拼接后的字符串中。

五、将字符串转化成数字

join() 方法可以将数组中的元素转化成一个字符串，那么还可以反过来吗？答案是肯定的，使用 split() 方法可以将一个字符串转化成一个由子字符串组成的数组。下面是一个示例代码：

const str = '1,2,3';
const arr = str.split(',');
console.log(arr); // 输出：['1', '2', '3']

在这个例子中，我们将一个以逗号隔开的字符串转化成了一个由子字符串组成的数组。需要注意的是，这里的子字符串都是字符串类型的，如果需要将它们转化成数字类型，需要使用 parseInt() 或者 parseFloat() 方法进行转换。

六、多维数组的处理

在 JavaScript 中，我们可以使用多维数组来表示一些更加复杂的数据结构。使用 join() 方法时，也可以对多维数组进行处理。下面是一个示例代码：

const arr = [['apple', 'banana'], ['orange', 'peach']];
const result = arr.join(',');
console.log(result); // 输出：'apple,banana,orange,peach'

在这个例子中，我们定义了一个包含 2 个子数组的多维数组。使用逗号作为分隔符进行 join() 拼接后，多维数组展开成了一个由子元素组成的一维数组。

七、多种分隔符的方式

除了前面提到的逗号或者其他单个字符，我们还可以使用类似 RegExp 的方式来定义一个复杂的分隔符规则。下面是一个示例代码：

const arr = ['apple', 'banana', 'orange'];
const result = arr.join(/,|-/);
console.log(result); // 输出：'apple-banana-orange'

在这个例子中，我们定义了一个以逗号或者横线为分隔符的规则，最终将数组中的元素拼接成了一个以横线隔开的字符串。

八、总结

本文从拼接字符串、转化成列表、没有参数的情况、稀疏数组的处理、将字符串转化成数字、多维数组的处理以及多种分隔符的方式等多个角度详细讲解了数组 join() 方法的用法。通过本文的介绍，相信读者对这个方法有了更加深入的理解和应用。