JavaScript - Insert a String at a Specific Index

These are the following methods to insert a string at a specific index in JavaScript:

1. Using the slice() Method

Inserting a string using the slice() method involves splitting the original string into two parts: one before the insertion point and one after. The new string is then placed between these slices, effectively inserting it at the desired index.

let str = "GeeksGeeks";
let str2 = "For";
let idx = 5;
let res = str.slice(0, idx)
    + str2 + str.slice(idx);
console.log(res);

GeeksForGeeks

2. Using JavaScript substring() Method

Inserting a string using the substring() method involves splitting the original string into two parts based on the index, inserting the new string between these parts, and then concatenating them. This modifies the string with the desired insertion at the specified position.

let str = "GeeksGeeks";
let str2 = "For";
let idx = 5;
let res = str.substring(0, idx) + str2 + str.substring(idx);
console.log(res);

GeeksForGeeks

3. Using Regular Expression

Inserting a string using a Regular Expression involves matching a specific position or pattern in the original string and using the replace() method to insert the new string at the desired location within the matched pattern.

let str = 'hello';
let res = str.replace(/(.{3})/, '$1***');
console.log(res);

hel***lo

5. Using Template Literals

Template literals provide a straightforward and readable way to insert a new string at a specified index. By breaking the original string into two parts and using template literals, you can easily insert the new string.

const str = "Hello, World!";
const str1 = " Amazing";
const idx = 7;

const s1 = str.slice(0, idx);
const s2 = str.slice(idx);

const res = `${s1}${str1}${s2}`;

console.log(res);

Hello,  AmazingWorld!

6. Using Array Spread Operator

In this approach, we will convert the string to an array of characters, use the array spread operator to insert the new string at the desired index, and then join the array back into a single string. This method is efficient and leverages modern JavaScript syntax for clarity and conciseness.

let str = "HelloWorld";
let str1 = "Beautiful";
let idx = 5;

let a = [...str];
a.splice(idx, 0, ...str1);
let res = a.join('');

console.log(res);

HelloBeautifulWorld

7. String Insertion Using Loops

Inserting a string using loops involves iterating through the original string until the specified index is reached, then adding the new string. The loop continues with the remaining part of the original string, constructing a new string with the inserted content.

function insertAt(str, str1, idx) {
    if (idx < 0 || idx > str.length) {
        return str; // or throw an error
    }

    let res = '';
    let i = 0;
    while (i < idx) {
        res += str[i];
        i++;
    }
    let j = 0;
    while (j < str1.length) {
        res += str1[j];
        j++;
    }
    while (i < str.length) {
        res += str[i];
        i++;
    }

    return res;
}

let str = "Hello World!";
let str1 = "JavaScript ";
let idx = 6;

console.log(insertAt(str, str1, idx));

Hello JavaScript World!