Convert an array to string javascript

Learn how to convert an array to string in javascript.

An array in javascript can hold many any types of data that is available in the language.

We will see different ways to form a string from different types of array.

Using toString() method to create a string from array.

Using toString() method on an array returns the string representation of the array.

//Normal array
const arr = [1, 2, 3, 4, 5];
console.log(arr.toString());
//'1,2,3,4,5,'

//Multi dimensional array
const multiDimArr = [[1, 2], [3, 4], [5, 6]];
console.log(multiDimArr.toString());
//'1,2,3,4,5,6'

//Array of objects
const objectsArr = [{a: 1, b: 2}, {a: 3, b: 4}, {a: 5, b: 6}, {a: 7, b: 8}];
console.log(objectsArr.toString());
//"[object Object],[object Object],[object Object],[object Object]"

//Array of booleans
const boolArr = [false, true, true, false];
console.log(boolArr.toString());
//"false,true,true,false"

//Array of functions
const funcArr = [(a) => {return a}, (a, b) => {return a + b}];
console.log(funcArr.toString());
//"a => {return a;},(a, b) => {return a + b;}"

All the values of the array are converted and are comma separated. Before forming the string it converts the value to different types.

For example if you see the array of functions, I have not added the semi colon at the end of the return statement but the the converted string contains it.

---

Using join() method to convert an array to string in javascript.

If you want to form the string of the array values with custom separator then join(separator) is the method you are looking for.

//Normal array
const arr = [1, 2, 3, 4, 5];
console.log(arr.join('-'));
//"1-2-3-4-5"

//Multidimensional Array
const multiDimArr = [[1, 2], [3, 4], [5, 6]];
console.log(multiDimArr.join('--'));
//"1,2--3,4--5,6"

//Array of objects
const objectsArr = [{a: 1, b: 2}, {a: 3, b: 4}, {a: 5, b: 6}, {a: 7, b: 8}];
console.log(objectsArr.join('---'));
//"[object Object]---[object Object]---[object Object]---[object Object]"

//Array of booleans
const boolArr = [false, true, true, false];
console.log(boolArr.join('_'));
//"false_true_true_false"

//Array of functions
const funcArr = [(a) => {return a}, (a, b) => {return a + b}];
console.log(funcArr.join('+'));
//"a => {return a;}+(a, b) => {return a + b;}"

It works the same ways as toString() method but you can decide your own separator.

For multi dimensional arrays only one level nested arrays will be converted to string with the passed separator, all other nested values after level 1 will be comma separated.

//Multi-level array
const inp = [["Jimmy", 30, ["Ford", "BMW", "Fiat"]], ["Fiona", 25, ["Ford", "BMW", "Fiat"]], ["Anny", 19, ["Ford", "BMW", "Fiat"]], ["Gabby", 27, ["Ford", "BMW", "Fiat"]], ["Kevin", 20, ["Ford", "BMW", "Fiat"]]];

console.log(inp.join('----'));

/*"Jimmy,30,Ford,BMW,Fiat----Fiona,25,Ford,BMW,Fiat----Anny,19,Ford,BMW,Fiat----Gabby,27,Ford,BMW,Fiat----Kevin,20,Ford,BMW,Fiat"*/

---

Using JSON.stringify().

If you want to create a string of the whole array as it is rather than its values like with the square bracket included then you an use the JSON.stringify().

const inp = [["Jimmy", 30, ["Ford", "BMW", "Fiat"]], ["Fiona", 25, ["Ford", "BMW", "Fiat"]], ["Anny", 19, ["Ford", "BMW", "Fiat"]], ["Gabby", 27, ["Ford", "BMW", "Fiat"]], ["Kevin", 20, ["Ford", "BMW", "Fiat"]]];

console.log(JSON.stringify(inp));

/*
"[['Jimmy',30,['Ford','BMW','Fiat']],['Fiona',25,['Ford','BMW','Fiat']],['Anny',19,['Ford','BMW','Fiat']],['Gabby',27,['Ford','BMW','Fiat']],['Kevin',20,['Ford','BMW','Fiat']]]"
*/

It just wrapped the whole array in a double quotes "".

---

Create custom function to create string from array values.

If you want to utilize different values from different types of arrays to create a string then you can create a custom function.

const arrayToString = (arr, key) => {
   //Form a string of given key of the object.
   return arr.reduce((a, b) => {
     a = `${a} ${b[key] || ''}`;
     return a.trim();
   }, ''); 
};

console.log(arrayToString([{a: 1, b: 2}, {a: 3, b: 4}], 'b'));
//"2 4"

console.log(arrayToString([{a: 1, b: 2}, {a: 3, b: 4}], 'c'));
//""