JavaScript - Insert a String at a Specific Index

Last Updated : 21 Nov, 2024

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.

JavaScript

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

Output

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.

JavaScript

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

Output

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.

JavaScript

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

Output

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.

JavaScript

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);

Output

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.

JavaScript

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

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

console.log(res);

Output

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.

JavaScript

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));