Insert a character after every n characters in JavaScript

Insertion of a specific character after every n characters in JavaScript is an easy-to-understand concept that gives us better understanding of JavaScript's string manipulation functions.

Here n can be any whole number ranging from 1 to less than the length of the string. In this article, we'll explore different methods to insert a "-" character after every 5 characters in a string.

Method 1: Using the slice() Method

The slice() method extracts a portion of a string and returns a new string. It accepts two parameters: the starting index and the ending index (exclusive).

let inputString = "Tutorials Point Simply Easy Learning";
let n = 5; // Insert character after every 5 characters
let insertChar = "-";
let outputString = "";

for (let i = 0; i < inputString.length; i += n) {
   let slice = inputString.slice(i, i + n);
   if (slice.length == n) {
      outputString += slice + insertChar;
   } else {
      outputString += slice;
   }
}

console.log(outputString);

Tutor-ials -Point- Simp-ly Ea-sy Le-arnin-g

Method 2: Using replace() with Regular Expression

The replace() method with regular expressions allows pattern-based replacements. We use .{n} to match exactly n characters and $& to reference the matched text.

let inputString = "Tutorials Point Simply Easy Learning";
let n = 5;
let insertChar = "-";

let outputString = inputString.replace(new RegExp(`.{${n}}`, 'g'), '$&' + insertChar);

console.log(outputString);

Tutor-ials -Point- Simp-ly Ea-sy Le-arnin-g

Method 3: Using split() and reduce()

This approach splits the string into individual characters and uses reduce() to build the result, inserting the character at every nth position.

let inputString = "Tutorials Point Simply Easy Learning";
let n = 5;
let insertChar = "-";

let outputString = inputString.split("").reduce(function(acc, val, i) {
   return i % n === 0 && i !== 0 ? acc + insertChar + val : acc + val;
}, "");

console.log(outputString);

Tutor-ials -Point- Simp-ly Ea-sy Le-arnin-g

Method 4: Using substr() and concat()

The substr() method extracts characters starting from a specified index, while concat() joins strings together. Note that substr() is deprecated; use slice() instead for new projects.

let inputString = "abcdefghijklmnopqrstuvwxyz";
let n = 5;
let insertChar = "-";
let outputString = "";

for (let i = 0; i < inputString.length; i += n) {
   let slice = inputString.substr(i, n);
   if (slice.length == n) {
      outputString = outputString.concat(slice, insertChar);
   } else {
      outputString = outputString.concat(slice);
   }
}

console.log(outputString);

abcde-fghij-klmno-pqrst-uvwxy-z

Comparison

Conclusion

JavaScript provides multiple approaches to insert characters after every n positions. The slice() method with a loop offers the best balance of readability and performance, while regular expressions provide a concise solution for pattern-based insertions.