Hey everyone, in this article we will understand the most essential method, the split method in Javascript.
The split() method allows you to split a string into an array of substrings based on a specified separator. The original string remains unchanged, and the resulting substrings are stored in an array.
Let’s explore the syntax, usage, and examples of the split method in JavaScript following below:
Syntax of the Split Method
Here’s the syntax of the split() method:
1 2 3 | string.split(separator, limit); |
Separator: This parameter specifies the character or regular expression used to split the string. If the separator is not provided, the entire string becomes a single array element. An empty string (“”) as the separator will split the string into individual characters.
Limit (Optional): The limit parameter defines the maximum number of splits to be found in the string. If the string exceeds the limit, it won’t be included in the resulting array.
Now let’s look at some examples to understand how the split() method works:
1. Splitting with a Single Character Separator
You can split a string based on any character or sequence of characters. For instance:
1 2 3 4 5 6 | const text = "apple,banana,orange,grape"; const fruits = text.split(','); console.log(fruits); // Output: ["apple", "banana", "orange", "grape"] |
2. Splitting a String into Individual Characters
If you want to split into an individual character then you can pass an empty string as the separator.
1 2 3 4 5 6 7 8 | const sentence = "Javascript"; const characters = sentence.split(''); console.log(characters); // Output: // ["J", "a", "v", "a" ,"s", "c", "r", "i", "p", "t"] |
3. Limiting the Number of Splits
You can limit the number of splits performed on a string by specifying the limit parameter.
1 2 3 4 5 6 | const text = "apple,banana,orange,grape"; const limitedFruits = text.split(',', 2); console.log(limitedFruits); // Output: ["apple", "banana"] |
Learn more: How to start and setup the ReactJS project? – A full Beginner guide
4. Splitting with a Regular Expression Separator
If you want to split the string with a regular expression then pass the expression in the method.
1 2 3 4 5 6 | const text = "apple banana,orange grape"; const words = text.split(/\s+/); // Split by one or more spaces console.log(words); // Output: ["apple", "banana,orange", "grape"] |
5. Splitting on Newlines
1 2 3 4 5 6 7 8 | const multilineText = "Line 1\nLine 2\nLine 3"; const lines = multilineText.split('\n'); console.log(lines); // Output: // ["Line 1", "Line 2", "Line 3"] |
6. Splitting Strings with Multiple Delimiters
Example-1:
1 2 3 4 5 6 | const data = "John:Doe:25"; const parts = data.split(/:/); console.log(parts); // Output: ["John", "Doe", "25"] |
Example-2:
1 2 3 4 5 6 7 | let str = 'Apples,Oranges;Bananas-Grapes'; let array = str.split(/,|;|-/); console.log(array); // Output: ["Apples", "Oranges", "Bananas", "Grapes"] |
In this last example, the regular expression /:/ or /,|;|-/ is used to split the string at each colon. This results in an array containing separate parts of the input data.
🗒️ Note: Remember that the split() method returns an array of substrings. You can access individual elements of the resulting array using array indexing (e.g., fruits[0] to access the first element).
So, that’s all about the split method in JS. With the split method, you have the flexibility to extract meaningful information from strings in JavaScript.
I hope you enjoyed the article and if you found this useful, then please share it with your friends and colleagues.
If you have any queries please feel free to post them in the comments section or anything that you wanted to ask through mail contact.
Happy Coding!
Also read,
- How to Replace Substring in Javascript?
- What are the Top Skills for Frontend Developer that you must know in 2022?
- [11] Helpful Functions in Javascript that You Need to Know
![[12] Helpful Functions in Javascript that You Need to Know](https://sidtechtalks.in/wp-content/uploads/2022/09/12-Helpful-Functions-in-Javascript-that-You-Need-to-Know-520x293.png)
