How to convert a JavaScript array into a string.

This is a tutorial on how to convert a JavaScript array into a string. Because there are multiple ways to convert an array into a string, I will provide examples of each approach and then explain their pros and cons.

Converting a JavaScript array into a string by using the toString() method.

The simplest approach involves using the Array.prototype.toString() method, which will return the array’s elements as a single string, separated by commas:

In the JavaScript example above, we created a simple array. After that, we then converted this array into a string by using the toString() method.

If you run this code on your own machine, you will see that the following string has been printed out to the console:

1,2,3

Here, you can see that our array elements have been automatically joined together (concatenated). Furthermore, the array elements have been separated out by commas.

The only drawback to using this approach is that you have no control over which character is used as the separator. It will always use commas to separate your array elements.

Converting an array into a string using the join() method.

If you want to use a different character as the separator for your array elements, then you can use the join() method. Similarly, this method can also be useful if you are using commas, but want to insert a blank space after each one:

If you run this example, you will see that we have added a space character after each comma.

The great thing about the join() method is that it allows you to manually specify the separator character. For example, if you want to separate each array element by a hyphen character instead of a comma, then you can do the following:

This will convert the JavaScript array into a string that looks like this: “1-2-3”.

Alternatively, if I want to use a (dot) character, then I can simply pass a “.” string in as the separator parameter:

The above snippet will result in a string that looks like this: “1.2.3”.

It is worth noting that the separator parameter for the join() method is completely optional. You do not have to provide a separator. However, if you fail to manually specify a parameter, it will act the same as the toString() method. In other words: It will use the comma character with no spaces as a default.

If one of your array values is null or undefined, then that value will be converted into an empty string. If it contains a boolean FALSE or TRUE value, then the join() method will convert that value into its textual value. i.e. false will become the string “false” and true will become the string “true”.

Using concatenation.

You can also use some simple concatenation to convert a JS array into a string:

This will convert the array elements into a string, with each element being separated by a comma.

Although this method works, I would personally advise against using it. Firstly, in my opinion, it feels “hacky”. Secondly, it makes your code far less readable as the intent of the operation is not as obvious.

So, in conclusion:

  • If you’re happy with the separator being a comma, then simply use the toString() method.
  • If you want to use a custom separator or add a blank space after the comma, then use the join() method.

Hopefully, you found this guide useful!

Facebook Comments