英文|

  译文 | 杨小爱

  在上节，我们学习如何使用 JavaScript Array reduce() 和 reduceRight() 方法将数组归约为一个值，错过的小伙伴可以点击文章《》进行学习。

  那么，在今天的教程中js替换字符串中的字符js替换字符串中的字符，我们将一起来学习如何使用JavaScript Array join()方法将数组的所有元素连接成由分隔符分隔的字符串。

  JavaScript 数组 join() 方法介绍

  join() 方法允许我们连接数组的所有元素并返回一个新字符串：

  <pre aria-describedby="shcb-language-1" data-shcb-language-name="CSS" data-shcb-language-slug="css" style="font-family: monospace, monospace;font-size: 16px;border-width: 0px;border-style: initial;border-color: initial;color: rgb(33, 37, 41);text-align: start;background-color: rgb(255, 255, 255);"><pre class="code-snippet__js" data-lang="css">Array.prototype.join([separator])</pre>

  join() 方法接受一个可选的参数分隔符，它是一个字符串，用于分隔结果字符串中数组的每对相邻元素。

  如果我们不将分隔符传递给 join() 方法，则分隔符默认为逗号。

  如果数组有一个元素，则 join() 方法将该元素作为字符串返回，而不使用分隔符。

  如果数组为空，则 join() 方法返回一个空字符串。

  当数组的元素不是字符串时，join() 方法在加入之前将它们转换为字符串。

  请注意，join() 方法将 undefined、null 和空数组 [] 转换为空字符串。

  JavaScript 数组 join() 方法示例

  让我们举一些使用 join() 方法的例子。

  1) 使用 JavaScript Array join() 方法加入 CSS 类

  以下示例使用 JavaScript Array join() 方法加入 CSS 类：

  <pre aria-describedby="shcb-language-2" data-shcb-language-name="JavaScript" data-shcb-language-slug="a href='https://www.veimoz.com/1483' title='通过js对数组和对象数组的排序的代码实例教程注意' target='_blank'javascript/a" style="font-family: monospace, monospace;font-size: 16px;border-width: 0px;border-style: initial;border-color: initial;color: rgb(33, 37, 41);text-align: start;background-color: rgb(255, 255, 255);"><pre class="code-snippet__js" data-lang="javascript">const cssClasses = ['btn', 'btn-primary', 'btn-active'];`const btnClass = cssClasses.join(' '); console.log(btnClass);`</pre>

  输出：

  <pre style="font-family: monospace, monospace;font-size: 16px;border-width: 0px;border-style: initial;border-color: initial;color: rgb(33, 37, 41);text-align: start;background-color: rgb(255, 255, 255);"><pre class="code-snippet__js" data-lang="nginx">btn btn-primary btn-active</pre>

  在这个例子中，我们有一个包含 CSS 类列表的数组。我们使用 join() 方法连接 cssClasses 数组的所有元素，并返回一个由空格分隔的 CSS 类字符串。

  2) 使用 JavaScript Array join() 方法替换所有出现的字符串

  此示例使用 JavaScript Array join() 方法将所有出现的空格 ' ' 替换为连字符 (-)：

  <pre aria-describedby="shcb-language-3" data-shcb-language-name="JavaScript" data-shcb-language-slug="javascript" style="font-family: monospace, monospace;font-size: 16px;border-width: 0px;border-style: initial;border-color: initial;color: rgb(33, 37, 41);text-align: start;background-color: rgb(255, 255, 255);"><pre class="code-snippet__js" data-lang="javascript">const title = 'JavaScript array join example';`const url = title.split(' ') .join('-') .toLowerCase(); console.log(url);`</pre>