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
Inserting string at position x of another string using Javascript
In this article, you are going to learn how to insert a string at a position in another string.
JavaScript does not give a direct way to achieve this. For this, we can use the slice method. The slice method extracts a section of a string and returns a new string. In addition to the slice() method we can also use the methods join() and substr().
Using the slice() Method of the String class
This slice() method gets parts of the string and returns the extracted part from the string and makes a new string. Following is the syntax of the slice() method.
String.slice(start, end);
The following are the parameters of this method −
Start − The start parameter is required. It identifies the position from where to start the taking out. The first character starts from the 0 indexes in the string.
End − This parameter is optional. It specifies the position where to stop the extraction. If not used, slice() selects all the characters from the start position to the end.
Return value − It returns a string, representing the extracted parts of the string.
Example
Let us see an example of this −
<!DOCTYPE html>
<html>
<head>
<title>Insert the string at position X of another string in javascript.</title>
</head>
<body>
<script>
function insertAtX(str1, str2, x) {
return `${str1.slice(0, x)}${str2}${str1.slice(x)}`
}
document.write(insertAtX("Hello World", "Test", 5));
</script>
</body>
</html>
Using the join() Method of the Array class
This method adds the element on an array into a string and returns the string. The elements will be broken up by the specified separator. By default, comma (,) is considered as separator. Following is the syntax of the join() method −
Array.join(separator)
Where, separator is an optional parameter. It specifies by a separator to be used, by default, the value of this parameter is comma(,).
This method returns a string, signifying the array values, split by the defined separator.
Example
In the following example, we are inserting one string into another by using slice() and join() methods.
<!DOCTYPE html>
<html>
<head>
<title>Insert the string at position X of another string in javascript.</title>
</head>
<body style="text-align: center" id="body">
<h1 style="color: green">tutorialspoint Easy to Learn</h1>
<p id="demo1"></p>
<button onclick="tutFunc(); ">click here</button>
<p id="demo2"></p>
<script>
var res1 = document.getElementById("demo1");
var res2 = document.getElementById("demo2");
var val1 = "tutorialsLearn";
var val2 = "point Easy to ";
var pos = 9;
//printing both of the string in demo1
demo1.innerHTML = "string first = " + val1 + "<br> string second = " + val2;
function tutFunc() {
//here we are printing new strings after extracted and Joined
demo2.innerHTML = [val1.slice(0, pos), val2, val1.slice(pos)].join("");
}
</script>
</body>
</html>
Using the substr() Method of the String class
This method gets parts of a string, starting at the character at the defined positions, and returns the specified number of characters. Following is the syntax of the substr() method.
String.substr(start, length)
Where,
Start identifies the position from where to begin the extraction. The character first of the string is at index 0.
If the start is positive and greater than or equal, to the length of the string, this method returns an empty string.
If the start is negative, this method uses it as an index from the end.
If the start is negative or larger than the length of the string, the start is used as 0.
Length − this parameter is optional. It identifies the number of characters that need to be extracted. If not used, it extracts the full string.
This method returns the new string having the extracted part of the text. If the length is 0 or negative, an empty string is returned.
Example
In the following example, we are inserting one string into another by using substr() Method.
<!DOCTYPE html>
<html>
<head>
<title>Insert the string at position X of another string in javascript.</title>
</head>
<body style="text-align: center" id="body">
<h1 style="color: green">tutorialspoint Easy to Learn</h1>
<p id="demo1"></p>
<button onclick="tutFunc(); ">click here</button>
<p id="demo2"></p>
<script>
var res1 = document.getElementById("demo1");
var res2 = document.getElementById("demo2");
var val1 = "tutorialsLearn";
var val2 = "point Easy to ";
var pos = 9;
//printing both of the string in demo1
res1.innerHTML =
"string first = " + val1 + "<br> string second = " + val2;
function tutFunc() {
//here we are printing new string after extracted and Joined
res2.innerHTML = val1.substr(0, pos) + val2 + val1.substr(pos);
}
</script>
</body>
</html>
686 Views
To Continue Learning Please Login