Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to parse a string from a JavaScript array?
In JavaScript, you can convert an array to a string using several built-in methods. The most common approaches are toString(), join(), and JSON.stringify().
Using toString() Method
The toString() method converts an array to a comma-separated string:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Array to String Conversion</title>
</head>
<body>
<h1>Parse a string from a JavaScript array</h1>
<div id="result"></div>
<button onclick="convertArray()">Convert Array to String</button>
<script>
let arr = ["Cow", "Lion", "Tiger", "Dog", "Cat"];
function convertArray() {
let result = document.getElementById("result");
result.innerHTML = "<strong>Original Array:</strong> " + JSON.stringify(arr) +
"<br><strong>String Result:</strong> " + arr.toString();
}
</script>
</body>
</html>
Original Array: ["Cow","Lion","Tiger","Dog","Cat"] String Result: Cow,Lion,Tiger,Dog,Cat
Using join() Method
The join() method allows you to specify a custom separator:
<!DOCTYPE html>
<html>
<body>
<div id="output"></div>
<script>
let fruits = ["Apple", "Banana", "Orange", "Mango"];
// Different join examples
let commaString = fruits.join(", ");
let dashString = fruits.join(" - ");
let spaceString = fruits.join(" ");
document.getElementById("output").innerHTML =
"Comma separated: " + commaString + "<br>" +
"Dash separated: " + dashString + "<br>" +
"Space separated: " + spaceString;
</script>
</body>
</html>
Comma separated: Apple, Banana, Orange, Mango Dash separated: Apple - Banana - Orange - Mango Space separated: Apple Banana Orange Mango
Comparison of Methods
| Method | Separator | Use Case |
|---|---|---|
toString() |
Comma (fixed) | Simple conversion |
join(separator) |
Custom | When you need specific formatting |
JSON.stringify() |
JSON format | Preserving data structure |
Using JSON.stringify()
For complex arrays or when you need to preserve the array structure as a string:
<!DOCTYPE html>
<html>
<body>
<div id="json-result"></div>
<script>
let mixedArray = ["Hello", 123, true, null, {name: "John"}];
let jsonString = JSON.stringify(mixedArray);
document.getElementById("json-result").innerHTML =
"<strong>Array:</strong> " + JSON.stringify(mixedArray) + "<br>" +
"<strong>JSON String:</strong> " + jsonString;
</script>
</body>
</html>
Array: ["Hello",123,true,null,{"name":"John"}]
JSON String: ["Hello",123,true,null,{"name":"John"}]
Conclusion
Use toString() for simple comma-separated strings, join() when you need custom separators, and JSON.stringify() for preserving complex data structures. Choose the method based on your specific formatting requirements.
Updated on: 2026-03-15T23:18:59+05:30
254 Views
Advertisements