【JavaScript 教程】第六章 数组15—join() : 将所有元素连接成一个字符串
共 2206字,需浏览 5分钟
·
2022-02-17 16:02
英文 | https://www.javascripttutorial.net/
译文 | 杨小爱
JavaScript 数组 join() 方法介绍
Array.prototype.join([separator])
join() 方法接受一个可选的参数分隔符,它是一个字符串,用于分隔结果字符串中数组的每对相邻元素。
如果我们不将分隔符传递给 join() 方法,则分隔符默认为逗号。
如果数组有一个元素,则 join() 方法将该元素作为字符串返回,而不使用分隔符。
如果数组为空,则 join() 方法返回一个空字符串。
当数组的元素不是字符串时,join() 方法在加入之前将它们转换为字符串。
请注意,join() 方法将 undefined、null 和空数组 [] 转换为空字符串。
JavaScript 数组 join() 方法示例
让我们举一些使用 join() 方法的例子。
1) 使用 JavaScript Array join() 方法加入 CSS 类
以下示例使用 JavaScript Array join() 方法加入 CSS 类:
const cssClasses = ['btn', 'btn-primary', 'btn-active'];
const btnClass = cssClasses.join(' ');
console.log(btnClass);
输出:
btn btn-primary btn-active
在这个例子中,我们有一个包含 CSS 类列表的数组。我们使用 join() 方法连接 cssClasses 数组的所有元素,并返回一个由空格分隔的 CSS 类字符串。
2) 使用 JavaScript Array join() 方法替换所有出现的字符串
此示例使用 JavaScript Array join() 方法将所有出现的空格 ' ' 替换为连字符 (-):
const title = 'JavaScript array join example';
const url = title.split(' ')
.join('-')
.toLowerCase();
console.log(url);
输出:
javascript-array-join-example
程序是怎么运行的:
首先,使用 split() 字符串方法将标题字符串按空格分割成一个数组。
其次,使用 join() 方法将结果数组中的所有元素连接成一个字符串。
第三,使用 toLowerCase() 方法将结果字符串转换为小写。
总结
在本教程中,我们学习了如何使用 JavaScript Array join() 方法将数组的所有元素连接成一个由分隔符分隔的字符串的方法。
今天的内容就到这里了。
如果您还想学习更多关于数组的内容,请点击下文链接进行学习。
【JavaScript 教程】第六章 数组14—reduce() :将数组的元素减少为一个值
【JavaScript 教程】第六章 数组13— forEach() :遍历数组元素
【JavaScript 教程】第六章 数组12— map() :转换数组元素
【JavaScript 教程】第六章 数组11— filter() :过滤数组中的元素
【JavaScript 教程】第六章 数组10— sort() :对数组中的元素进行排序
【JavaScript 教程】第六章 数组09— some() :检查数组中是否至少有一个元素通过了测试
【JavaScript 教程】第六章 数组08— every() :检查数组中的每个元素是否都通过了测试
【JavaScript 教程】第六章 数组07— index() :在数组中定位一个元素
【JavaScript 教程】第六章 数组06— slice() :复制数组元素
【JavaScript 教程】第六章 数组05— splice():删除、插入和替换
【JavaScript 教程】第六章 数组04— JavaScript 队列
【JavaScript 教程】第六章 数组03— Stack :使用 Array 的push()和pop()方法实现堆栈数据结构
【JavaScript 教程】第六章 数组02— Array Length:如何有效地使用数组的长度属性
【JavaScript 教程】第六章 数组01— 介绍JavaScript中的Array类型
学习更多技能
请点击下方公众号