---

Search posts under JavaScript:

---

Split String in JavaScript

How to split a string into an array of sub strings in JavaScript?

String Split

Spliting means separating, string split is nothing but splitting the string, that means we can split the string into an array.

In JavaScript, by using split() method we can split a string into an array of substrings and returns the new array. This method does not change the original string.

EXAMPLE 1: Spliting a string into an array (Each value is sperated by comma).

<p>Click the below button to extract.</p>
<input type="button" value="Split" onclick="Function()" />
<p id="myId"></p>

<script>
    function Function() {
        var a = "Sheo Narayan is a software professional since 2000";
        var r = a.split(" ");
        document.getElementById("myId").innerHTML = r;
    }
</script>

In the above code snippet we have given Id as "myId" to the second <p> element, there is a string with the variable a in the <script> code. We need to split the value of the string into an array of substrings, for that we used .split(" ").

The string method split() seperates each value in the string with the operator comma(,). Onclick of the button "Split" in the HTML code fires the Function() in the <script> code at the same time the string method split() starts spliting the string into an array of substrings and gives the output. 

NOTE: We have given a single space between the inverted commas inside the split(" "), it leads to separate each value in a string with comma.

OUTPUT

EXAMPLE 2: Spliting the each character including white space. 

<p>Click the below button to extract.</p>
<input type="button" value="Split" onclick="Function()" />
<p id="myId"></p>

<script>
    function Function() {
        var a = "Sheo Narayan is a software professional since 2000";
        var r = a.split("");
        document.getElementById("myId").innerHTML = r;
    }
</script>

Spliting each character including white space

Onclick of the button "Split" in the HTML code fires the Function() in the <script> block at the same time split("") method splits the each character including white space in a string and returns the output.

NOTE: We did not given any space between the inverted commas inside the split("") method, it leads to seperate each character in a string including white space.

OUTPUT

EXAMPLE 3: Omiting the sperator parameter in the split() method. (Returns the full length of the string)

<p>Click the below button to extract.</p>
<input type="button" value="Split" onclick="Function()" />
<p id="myId"></p>

<script>
    function Function() {
        var a = "Sheo Narayan is a software professional since 2000";
        var r = a.split();
        document.getElementById("myId").innerHTML = r;
    }
</script>

Omit separator parameter

We have given the split() value empty, so onclick of the button returns the full length of the string with out any separation.

NOTE: The split() method with empty value returns the full length of the string, that means the split() method omits the separator parameter.

OUTPUT

EXAMPLE 4: Spliting the limited values in a string.

<p>Click the below button to extract.</p>
<input type="button" value="Split" onclick="Function()" />
<p id="myId"></p>

<script>
    function Function() {
        var a = "Sheo Narayan is a software professional since 2000";
        var r = a.split(" ", 5);
        document.getElementById("myId").innerHTML = r;
    }
</script>

Spliting limited values

In the above code snippet we have used split(" ", 5), that means it splits and returns only first 5 values in a string as output.

NOTE: The split() method value includes the single space between inverted commas and numerical digit 5, that means it seperates and returns the first 5 values of a string.

OUTPUT

EXAMPLE 4 : Spliting the limited characters including white spaces in a string.

<p>Click the below button to extract.</p>
<input type="button" value="Split" onclick="Function()" />
<p id="myId"></p>

<script>
    function Function() {
        var a = "Sheo Narayan is a software professional since 2000";
        var r = a.split("", 20);
        document.getElementById("myId").innerHTML = r;
    }
</script>

Spliting limited characters

In the above code snippet we have used split("", 20), that means it splits and returns only first 20 characters includes white spaces in a string as output.

NOTE: The split method value is split("", 25), in this there is no space between the inverted commas and  there is numerical digit 25, that means the split() method splits the first 25 characters of a string including white spaces.

OUTPUT

EXAMPLE 5: Replacing the particular character in a string by split() method.

<p>Click the below button to extractat particular character.</p>
<input type="button" value="Split" onclick="Function()" />
<p id="myId"></p>

<script>
    function Function() {
        var a = "is this i phone is yours!";
        var r = a.split("i");
        document.getElementById("myId").innerHTML = r;
    }
</script>

Spliting at particular characters

In the above code snippet we have given value "i" to the split method. Onclick of the button splits the string at character "i". The specified caracter is replace by the comma separator and returns the output.

OUTPUT