I'm trying to turn a JavaScript array into a comma-separated list. I have an array like this:
<script>
const myArray = ["apple", "banana", "cherry", "date"];
</script>
And I want to convert it into a string like this:
"apple, banana, cherry, date"
I've been trying different approaches, but I'm not sure what's the easiest way to do it. Can someone help me out with this?
Comments (7)
Easy way to turn JavaScript array into comma-separated list?
<script>
const myArray = ["apple&qu…
https://www.3schools.in/p/embed.html?q=CjxzY3JpcHQ+CiBjb25zdCBteUFycmF5ID0gWyJhcHBsZSIsICJiYW5hbmEiLCAiY2hlcnJ5IiwgImRhdGUiXTsKIGNvbnN0IGNvbW1hU2VwYXJhdGVkID0gbXlBcnJheS5qb2luKCcsICcpOwoKIGNvbnNvbGUubG9nKGNvbW1hU2VwYXJhdGVkKTsgLy8gT3V0cHV0OiAiYXBwbGUsIGJhbmFuYSwgY2hlcnJ5LCBkYXRlIgo8L3NjcmlwdD4=
The join() method takes an argument, which is the separator you want between the array elements. In this case, we've used ', ' to add a comma and a space between each element.
https://www.3schools.in/p/embed.html?q=CjxzY3JpcHQ+CiBjb25zdCB0cmlja3lBcnJheSA9IFsiYXBwbGUiLCAiYmFuYW5hLCBjaGVycnkiLCAiZGF0ZSJdOwogY29uc3QgY29tbWFTZXBhcmF0ZWQgPSB0cmlja3lBcnJheS5tYXAoaXRlbSA9PiBgIiR7aXRlbX0iYCkuam9pbignLCAnKTsKCiBjb25zb2xlLmxvZyhjb21tYVNlcGFyYXRlZCk7IC8vIE91dHB1dDogImFwcGxlLCBiYW5hbmEsIGNoZXJyeSwgZGF0ZSIKPC9zY3JpcHQ+"
By wrapping each element with double quotes, you ensure that even if an element contains a comma, it won't be split into multiple parts when joining.
https://www.3schools.in/p/embed.html?q=CjxzY3JpcHQ+CiBjb25zdCBzcGFjZWRBcnJheSA9IFsiIGFwcGxlICIsICJiYW5hbmEgICIsICIgY2hlcnJ5IiwgImRhdGUgIl07CiBjb25zdCBjb21tYVNlcGFyYXRlZCA9IHNwYWNlZEFycmF5Lm1hcChpdGVtID0+IGAiJHtpdGVtLnRyaW0oKX0iYCkuam9pbignLCAnKTsKCiBjb25zb2xlLmxvZyhjb21tYVNlcGFyYXRlZCk7IC8vIE91dHB1dDogImFwcGxlLCBiYW5hbmEsIGNoZXJyeSwgZGF0ZSIKPC9zY3JpcHQ+
By using trim() on each element before wrapping it with double quotes, you ensure that any leading or trailing spaces are removed before joining.
https://www.3schools.in/p/embed.html?q=CjxzY3JpcHQ+CiBjb25zdCBtZXNzeUFycmF5ID0gWyJhcHBsZSIsIHVuZGVmaW5lZCwgImJhbmFuYSIsICIiLCAiY2hlcnJ5IiwgbnVsbCwgImRhdGUiXTsKIGNvbnN0IGNvbW1hU2VwYXJhdGVkID0gbWVzc3lBcnJheQogIC5maWx0ZXIoaXRlbSA9PiBpdGVtICE9PSB1bmRlZmluZWQgJiYgaXRlbSAhPT0gbnVsbCAmJiBpdGVtICE9PSAiIikKICAubWFwKGl0ZW0gPT4gYCIke2l0ZW0udHJpbSgpfSJgKQogIC5qb2luKCcsICcpOwoKIGNvbnNvbGUubG9nKGNvbW1hU2VwYXJhdGVkKTsgLy8gT3V0cHV0OiAiYXBwbGUsIGJhbmFuYSwgY2hlcnJ5LCBkYXRlIgo8L3NjcmlwdD4=
In this code, we use filter() to remove the unwanted elements (undefined, null, and empty strings) before proceeding with the mapping and joining.