JavaScript - how to replace part of string from given index?

In this article, we're going to have a look at how to replace part of string from given index in JavaScript.

Quick solution:

// ONLINE-RUNNER:browser;

var text = 'This is text.'
var index = 2;
var insert = '__';

var result = text.substring(0, index) + insert 
    + text.substring(index + insert.length);

console.log(result);

Note: read this article to know how to remove part of text for given indexes.

Check below example for better solution.

1. Custom method example

Presented in this section solution allows to insert text outside of given string filling space with any characters (by default with space).

// ONLINE-RUNNER:browser;

function repeatText(count, text) {
	var result = '';
  	for (var i = 0; i < count; ++i) {
    	result += text;
    }
  	return result;
}

function replaceText(text, insert, index, spacer) {
  	if (spacer == null) {
      spacer = ' ';
    }
    var prefix = text.substring(0, index);
    var postfix = text.substring(index + insert.length);
  	var space = repeatText(index - text.length, spacer);
  
    return prefix + space + insert + postfix;
}

// Usage example:

console.log( replaceText('This is text.', '__',  0) ); // __is is text.
console.log( replaceText('This is text.', '__',  2) ); // Th__ is text.
console.log( replaceText('This is text.', '__', 11) ); // This is tex__

console.log( replaceText('This is text.', '__', 13) ); // This is text.__
console.log( replaceText('This is text.', '__', 15) ); // This is text.  __

console.log( replaceText('text...', '__', 10, '++') ); // text...++++++__

2. Custom method example with ES 2015

ES 2015 introduced repeat() method for string.

// ONLINE-RUNNER:browser;

const replaceText = (text, insert, index, spacer = ' ') => {
  const prefix = text.substring(0, index);
  const postfix = text.substring(index + insert.length);
  const space = spacer.repeat(index < text.length ? 0 : index - text.length);

  return prefix + space + insert + postfix;
};

// Usage example:

console.log( replaceText('This is text.', '__',  0) ); // __is is text.
console.log( replaceText('This is text.', '__',  2) ); // Th__ is text.
console.log( replaceText('This is text.', '__', 11) ); // This is tex__

console.log( replaceText('This is text.', '__', 13) ); // This is text.__
console.log( replaceText('This is text.', '__', 15) ); // This is text.  __

console.log( replaceText('text...', '__', 10, '++') ); // text...++++++__