In this article, we will see how to convert a comma-separated string to an array using JavaScript. A comma-separated string can be converted to an array using the following approaches:
Methods to Convert Comma-separated String to JavaScript Array:
Table of Content
Method 1: Using the JavaScript split() method
The split() method is used to split a string based on a separator. This separator could be defined as a comma to separate the string whenever a comma is encountered. This method returns an array of strings that are separated.
Syntax:
string.split(', ');
Example: In this example, we will be using the split() method to convert a comma-separated string to an array using Javascript.
// Function to convert comma-separate // string to attay function separateString() {
// Input string
originalString = "One, Two, Three, Four, Five" ;
// Converted array
separatedArray = originalString.split( ', ' );
// Display output
console.log(separatedArray);
} separateString(); |
[ 'One', 'Two', 'Three', 'Four', 'Five' ]
Method 2: Using JavaScript loops and .slice() method
This approach involves iterating through each character in the string and checking for the comma. A variable previousIndex is defined which keeps track of the first character of the next string. The slice method is then used to remove the portion of the string between the previous index and the current location of the comma found. This string is then pushed onto a new array. This process is then repeated for the whole length of the string. The final array contains all the separated strings.
Syntax:
string.slice(startingIndex, endingIndex);
Example: In this example, we will be converting a comma-separated value to a Javascript string.
originalString = "One, Two, Three, Four, Five" ;
separatedArray = []; // Index of end of the last string let previousIndex = 0; for (i = 0; i < originalString.length; i++) {
// Check the character for a comma
if (originalString[i] == "," ) {
// Split the string from the last index
// to the comma
separated = originalString.slice(previousIndex, i);
separatedArray.push(separated);
// Update the index of the last string
previousIndex = i + 1;
}
} // Push the last string into the array separatedArray.push(originalString.slice(previousIndex, i)); console.log(separatedArray); |
[ 'One', ' Two', ' Three', ' Four', ' Five' ]
Method 3: Using Array.from() and .split() method
The Javascript Array.from() method is used to create a new array instance from a given array, string, or object.
Syntax:
Array.from(object, mapFunction, thisValue);
Example: In this example, we will use Array.from() and .spilt() methods to split the strings and convert them to an array.
// Input string originalString = "One, Two, Three, Four, Five" ;
// Getting required array form string // by split and array.form methods const separatedArray = Array.from( originalString.split( "," )
); // Display the output console.log(separatedArray); |
[ 'One', ' Two', ' Three', ' Four', ' Five' ]
Method 4: Using Lodash _.split() Method
In this approach, we are using the Lodash _.split() method that returns the array of the gievn value having definite separator.
Example: In this example, we are using Lodash _.split() method.
// Defining Lodash variable const _ = require( 'lodash' );
let str = "Geeks,for,Geeks" ;
// Using _.replace() method console.log(_.split(str, '-' , 1))
|
Output:
[ 'Geeks', 'for', 'Geeks' ]