Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
JavaScript Insert space after every two letters in string?
In this article we are going to learn about how to insert space after every two letters in string. Before we jump into the article let’s have a quick view on the strings in JavaScript.
A sequence of one or more characters—which could be numbers, or symbols—is referred to as a string. Strings are immutable primitive data types in JavaScript, which means they cannot be changed.
Let’s dive into the article to learn more about inserting a space after every two letters in strings. For this, use replace() along with regular expressions.
The replace() methodinJavaScript
The replace() method returns a new string with one, some, or all matches of a pattern replaced by a replacement. A string or a RegExp can be used as the pattern, and a function can be called for each match as the replacement. Only the first instance of pattern will be replaced, if it is a string.
Syntax
Following is the syntax for replace()
string.replace(searchValue, newValue)
Example
In the following example we are running a script to insert space after two letters.
<!DOCTYPE html>
<html>
<body>
<script>
function space(s) {
return s.toString().replace(/\d{2}(?=.)/g, '$& ');
}
document.write(space(9848004322148));
</script>
</body>
</html>
On running the above script, the output window will pop up and display the number that was applied with spaces after every two characters on the webpage as the event triggers, and allows for spaces between every two characters.
Example
Considering the following example, where we are using the regex approach to apply spaces.
<!DOCTYPE html>
<html>
<body>
<script>
const regex = /\d{2}(?!$)/g;
function Number(num) {
return num.replace(regex, "$& ");
}
const strings = ['1234567890'];
for (const string of strings) {
document.write(string, '=>', Number(string));
}
</script>
</body>
</html>
When the script gets executed, it will generate an output consisting of string content and applied space after every two characters gets displayed on the web-browser, occurred by the event which gets trigger when the user executes the script.
Example
Let’s execute the below code to apply spaces after every 2 characters.
<!DOCTYPE html>
<html>
<body>
<script>
var values = "JavaScriptTutorial";
var result = values.replace(/.{1,2}(?=(.{2})+$)/g, '$& ');
document.write("The actual result is=");
document.write(values+ "<br>");
document.write("After inserting space at nth position=")
document.write(result);
</script>
</body>
</html>
When the script gets executed, it will generate an output display the actual result and after inserting spaces result on the web-browser, as the spaces was applied on triggering the event when user runs the script.
Example
Let’s consider the another example where we are using slice() along with join().
<!DOCTYPE html>
<html>
<body>
<script>
var str="welcometothetutorialspoint";
function formatStr(str, n) {
var a = [], start=0;
while(start<str.length) {
a.push(str.slice(start, start+n));
start+=n;
}
document.write(a.join(" "));
}
formatStr(str,2);
</script>
</body>
</html>
On running the above script, the output window will pop up and display a text that was applied with spaces after every two characters displayed on the webpage when the event gets triggered.
3K+ Views
