Methods of JavaScript

String Object
 String Object
• Strings are objects within the JavaScript language. They are not stored as character
arrays, so built-in functions must be used to manipulate their values.

JavaScript String Length

• The length property returns the length of a string.

• Method used: Length()
• Code:
<script>
var text =“Javascript”;
document.getElementById(“p_id").innerHTML = text.length;
</script>
• Output:
10
 Extracting String Parts

There are 3 methods for extracting a part of a string:

•slice(start, end)
•substring(start, end)
•substr(start, length)
JavaScript String slice()
• slice() extracts a part of a string and returns the extracted part in a new string. JavaScript
counts positions from zero.
The method takes 2 parameters: the start position, and the end position.
• Coding:
<script>
var str = “JavaScript";
document.getElementById("demo").innerHTML = str.slice(4,7);
</script>
Output:
Scr
• If you omit the second parameter, the method will slice out the rest of the string.
JavaScript String substring()
• substring() is similar to slice(). The difference is that substring() cannot accept negative
indexes.
• Coding:
<script>
var str = “JavaScript";
document.getElementById("demo").innerHTML = str.substring(4,7);
</script>
• Output:
Scr
JavaScript String substr()
• In this method, the second parameter specifies the length of the string.
Coding:
<script>
var str = “Web Technologies";
document.getElementById("demo").innerHTML = str.substr(7,6);
</script>
Output:
Hnolog
Replacing String Content
The replace() method replaces a specified value with another value in a string.
Coding:
<script>
text = document.getElementById("demo").innerHTML;
document.getElementById("demo").innerHTML=text.replace(“Java”, “JavaScript”);
<script>
Output:
I use Java.
I use JavaScript.
• By default, the replace() method replaces only the first match.
Converting to Upper and Lower Case

• A string is converted to upper case with toUpperCase().

• A string is converted to lower case with toLowerCase().
• Coding:
<script>
function myFunction() {
var text = document.getElementById("demo").innerHTML;
document.getElementById("demo").innerHTML = text.toUpperCase();
document.getElementById("demo").innerHTML = text.toLowerCase();
}
</script>
Output:
JAVASCRIPT Programming
JAVASCRIPT PROGRAMMING
javascript programming
 JavaScript String concat()
• concat() joins two or more strings
• Coding:
Output:
<script>
var text1 = "Hello"; text1.concat(" ",text2)
Hello + World! Hello World!
var text2 = "World!";
var text3 = text1.concat(" ",text2);
document.getElementById("demo").innerHTML = text3;
</script>
JavaScript String trim()
The trim() method removes whitespace from both sides of a string.
Output:
Coding:
<script>
Length text1=22
let text1 = " Hello World! ";
Length2 text2=12
let text2 = text1.trim();
document.getElementById("demo").innerHTML = "Length text1=" + text1.length +
"<br>Length2 text2=" + text2.length;
</script>
 JavaScript String padStart()
• The padStart() method pads the current string with another string (multiple times, if needed)
until the resulting string reaches the given length.
• The padding is applied from the start of the current string.
Syntax:
padStart(targetLength, padString)
Coding:
<script>
var text = "5";
document.getElementById("demo").innerHTML = text.padStart(4,0);
</script>
Output:
0005
 JavaScript String padEnd()
• The padEnd() method in JavaScript is used to pad a string with another string until it
reaches the given length. The padding is applied from the right end of the string.
• Coding
<script>
Var text = "5";
document.getElementById("demo").innerHTML = text.padEnd(4,0);
</script>
Output:
5000
Extracting String Characters
There are 3 methods for extracting string characters:
•charAt(position)
•charCodeAt(position)
•Property access [ ]
 JavaScript String charAt()
The charAt() method returns the character at a specified index (position) in a string:
Coding:
<script>
var text = "HELLO WORLD";
document.getElementById("demo").innerHTML = text.charAt(0);
</script>
Output:
H
JavaScript String charCodeAt()
The charCodeAt() method returns the unicode of the character at a specified index in a string:
Coding:
The method returns a UTF-16 code (an integer between 0 and 65535).
<script>
Output:
var text = "HELLO WORLD";
72
document.getElementById("demo").innerHTML =
text.charCodeAt(0);
</script>
 Property Access
Coding:
<script>
var str = "HELLO WORLD";
document.getElementById("demo").innerHTML = str[0];
</script>
Output:
HELLO WORLD

str[0]

• Property access might be a little unpredictable. It makes strings look like arrays (but
they are not).
 JavaScript String indexOf()
• The indexOf() method returns the index of (the position of) the first occurrence of a specified
text in a string.
• Coding:
<script>
var str = “Javascript is easy to learn";
document.getElementById("demo").innerHTML = str.indexOf(“easy");
</script>
• Output:
14
JavaScript String lastIndexOf()
• Output:
The lastIndexOf() method returns the index of the last occurrence of a specified text in a
Coding:
string.
23
<script>
var str = “Javascript is easy to learn";
document.getElementById("demo").innerHTML = str.lastIndexOf("e");
</script>
 • Both indexOf(), and lastIndexOf() return -1 if the text is not found.
• The lastIndexOf() methods searches backwards (from the end to the beginning), meaning:
if the second parameter is 15, the search starts at position 15, and searches to the beginning
of the string.
JavaScript String search()
The search() method searches a string for a specified value and returns the position of the
match
• The two methods are NOT equal. These are the differences:
• The search() method cannot take a second start position argument.
• The indexOf() method cannot take powerful search values (regular expressions).
Output:
Coding:
14
<script>
var str = “JavaScript is easy to learn";
document.getElementById("demo").innerHTML = str.search(“e");
</script>
 JavaScript String match()
• The match() method searches a string for a match against a regular expression,
and returns the matches, as an Array object.
• Coding:
<script>
let text = "The rain in SPAIN stays mainly in the plain";
document.getElementById("demo").innerHTML = text.match(/ain/g);
</script>
Output:
ain,ain,ain.
JavaScript String includes()
The includes() method returns true if a string contains a specified value.
• Syntax
string.includes(searchvalue, start).
Coding:
<script>
let text = "Hello world, welcome to the universe.";
document.getElementById("demo").innerHTML = text.includes("world", 12);
</script>
Output:
false
JavaScript String startsWith()
The startsWith() method returns true if a string begins with a specified value,
Output:
otherwise
True false.
Coding:
<script>
let text = "Hello world";
document.getElementById("demo").innerHTML = text.startsWith("o",4);
 YOU
H ANK
T