Arrays are a powerful feature of any language. They let you house multiple pieces of information easily. They will maintain the order of items being added and can even be sorted. In modern web browsers, they even handle auto-magically converting themselves into human readable strings.

数组是任何语言的强大功能。 它们使您可以轻松地存储多条信息。 它们将保持添加项目的顺序，甚至可以进行排序。 在现代的网络浏览器中，它们甚至可以自动地将自己转换为人类可读的字符串。

Even with the modern niceties, it’s still good to know how to convert an array to a string for those times when you need to massage an array into another format, or want to do something more than simply comma separating the values (the default behavior).

即使有了现代的技巧，当您需要将数组转换为另一种格式，或者想做一些事情而不是简单地用逗号分隔值(默认行为)时，仍然知道如何将数组转换为字符串仍然是一件好事。

入门 (Getting Started)

No special tools required. You can hack along in either your web browser’s console or using the Node.js REPL. The commands utilized are baked into the Array Object’s prototype.

无需特殊工具。 您可以在Web浏览器的控制台中或使用Node.js REPL进行修改。 所使用的命令被烘焙到数组对象的原型中。

要串还是不串。 (To string, or Not to String.)

If you were to run the following in your browser:

如果要在浏览器中运行以下命令：

alert([1, 2, 3]);

You would receive an alert with the message 1,2,3 without any additional work on your part. If all you need to do is display the contents of an array in this format, this can get you pretty far. This even works when referencing array objects inside of template literals.

您将收到一条消息1,2,3的警报，而无需您做任何其他工作。 如果您需要做的就是以这种格式显示数组的内容，这可以使您受益匪浅。 当引用模板文字内部的数组对象时，这甚至也可以使用。

Under the hood, the array items are being joined together as a string, using the comma , character as the delimiter. It’s the same as running either of the following:

在幕后，使用逗号,字符作为分隔符，将数组项作为字符串连接在一起。 与运行以下任何一项相同：

[1, 2, 3].toString();[1, 2, 3].join();

Both result in the same 1,2,3 string.

两者都导致相同的1,2,3字符串。

In fact, that’s all that the .toString() method can do for us. It accepts no parameters so it’s usefulness is fairly limited.

实际上， .toString()方法可以为我们完成所有工作。 它不接受任何参数，因此其用途相当有限。

Even though arrays are actually objects in JavaScript, the .toString() method for an array overrides the object’s .toString() method, that’s why we don’t end up with the pesky and way less useful [object Object] string.

尽管数组实际上是JavaScript中的对象，但数组的.toString()方法会覆盖对象的.toString()方法，这就是为什么我们不会以讨厌的和不太有用的[object Object]字符串结束的原因。

一起加入 (Join Together)

While it’s default behavior (without any passed parameters) is the same as .toString(), the .join() method is significantly more robust.

尽管它的默认行为(不带任何传递的参数)与.toString()相同，但.join()方法的健壮性更高。

Let’s say you wanted to include a space after the comma when creating your string, you can tell .join() the exact string to use:

假设您要在创建字符串时在逗号后添加空格，可以告诉.join()确切的字符串以供使用：

[1, 2, 3].join(', ');

Prefer to have each array item on it’s own line? Pass in a new line character:

宁愿将每个数组项放在自己的行上？ 传递换行符：

[1, 2, 3].join('\n');

Working with HTML and want to use those breaks instead?

使用HTML并想使用这些中断吗？

[1, 2, 3].join('
');

Want HTML breaks AND new lines?… Okay, you get the idea.

想要HTML换行符和换行符吗？…好的，您明白了。

The .join() method accepts an optional parameter that lets you define the separator character or characters you’d like to use to join the array items together.

.join()方法接受一个可选参数，该参数使您可以定义一个或多个分隔符，以将数组项连接在一起。

谈到HTML (Speaking of HTML)

One of my favorite .join() tricks, before template literals and JSX made it extremely easy to work with multiple line blocks of markup, was to use .join() to assemble an array of HTML tags into a string:

我最喜欢的.join()技巧之一是在模板文字和JSX使得使用多个行标记块变得极其容易之前，是使用.join()将HTML标记数组组装成字符串：

[  '
    
     ',    '
      ',      '
       ',        '
',        '
',      '
',    '
',    '
      ',      '
       ',        '
',        '
',      '
',    '
',  '
     
      
       
Name
       
Level
      
     
     
      
       
Alligator
       
9001
      
     
    
',].join('');

Passing in an empty string to .join() simply joins the array items without any additional characters.

将空字符串传递给.join()只需连接数组项，而无需任何其他字符。

Still pretty handy for dealing with multiple line strings and/or markup when you don’t have access to some of the more modern syntax options.

当您无法使用某些更现代的语法选项时，处理多个行字符串和/或标记仍然非常方便。

结论 (Conclusion)

Even if all you’re trying to do is display a comma separated list of array items to a user, you can still benefit from using the .join() method. It gives you more control over the output which will make things easier to read for your users.

即使您要做的只是向用户显示以逗号分隔的数组项列表，您仍然可以从使用.join()方法中受益。 它使您可以更好地控制输出，使用户更容易阅读。

Working with a back-end server that doesn’t understand arrays being passed-in? Join your array items into a single value and you’re good to go!

使用不了解传入数组的后端服务器？ 将数组项合并为一个值，您就可以开始了！

翻译自: