JavaScript arrays: combining and splitting - How to split a string into an array using JavaScript
(Page 3 of 4 )
In the previous sections, we looked on combining or joining the arrays in to a string. Now, we shall do the reverse: split an existing string into an array.
Let us start to develop a simple script (JavaScript) to split a string into an array. Take a look at the following code:
<html>
<head>
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
<script id="clientEventHandlersJS" language="javascript">
<!--
function Show()
{
var SimpleString = "abc;def;ghi;jkl;mno;qrs";
var myArray = SimpleString.split(";");
for (var i = 0; i < myArray.length; i++)
{
document.write(myArray[i] + "<BR>");
}
}
function BtnDisplay_onclick() {
Show();
}
//-->
</script>
</head>
<body>
<form id="form1">
<input type="button" value="Show" id="BtnDisplay" name="BtnDisplay" onclick="return BtnDisplay_onclick()">
</form>
</body>
</html>
The next section will explain the previous code in detail.
How to split a string into an array using JavaScript: discussion
Within the code in the previous section, I mainly created a simple button (which is identified as “BtnDisplay”). The button is defined with an “onclick” event which calls a JavaScript function, “BtnDisplay_onclick.” The same function simply calls another JavaScript function named “Show.”
The function “Show” is defined as follows:
function Show()
{
var SimpleString = "abc;def;ghi;jkl;mno;qrs";
var myArray = SimpleString.split(";");
for (var i = 0; i < myArray.length; i++)
{
document.write(myArray[i] + "<BR>");
}
}
Before trying to understand the above script, we need to understand the concept of splitting. First of all, to split a string into an array, we need to know the “separator,” which separates each element within the same string.
Without knowing the “separator,” we will not be able to split the string into an array. The “separator” would be generally a symbol (of delimiter) or space or a control character, but it depends upon the application we use.
In the above code fragment, I worked with a sample string as follows:
var SimpleString = "abc;def;ghi;jkl;mno;qrs";
From the above statement, we can easily determine that the “separator” for the elements would be “;” or semi-colon. Proceeding further we have the following:
var myArray = SimpleString.split(";");
The above statement makes the string split into several elements, based on the separator “;” (semi-colon). Once the splitting is completed, it creates an array of those elements and assigns the same to the variable “myArray.” We use the following loop to display all the elements (as explained in my first article):
for (var i = 0; i < myArray.length; i++)
{
document.write(myArray[i] + "<BR>");
}
Next: How to split a sentence into words using JavaScript >>
More JavaScript Articles
More By Jagadish Chaterjee