JavaScript String Methods

Strings are texts that aid in the storage of data that may be expressed. A JavaScript string contains a string of characters such as "Welcome To WebTutor." A string is any text enclosed in double or single quotations.

Syntax

var wt= "Welcome To WebTutor"

String indexes begin at 0. The first character is in place 0, the second in position 1, and so on. We may call any of JavaScript's pre-defined methods since it automatically transforms string primitives to objects.

1. String length

A string's length is returned by the length property.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Length</h1>
<script>
    var str = "webtutor.dev";
    document.write(str.length);
</script>

</body>
</html>

2. String slice()

Extracts a section of a string and returns a new string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String slice()</h1>
<script>
    var str = "Learn To Code For Free";
    var result = str.slice(6, 12);
    document.write(result);
</script>

</body>
</html>

3. String substring()

Extracts a section of a string between two specified indices and returns a new string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String substring()</h1>
<script>
    var str = "Learn To Code For Free";
    document.write(str.substring(6, 12));
</script>

</body>
</html>

4. String substr()

Extracts a section of a string starting from a specified index and returns a new string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String substr()</h1>
<script>
    var str = "Learn To Code For Free";
    document.write(str.substr(6, 12));
</script>

</body>
</html>

5. String replace()

Searches a string for specified characters and replaces them with new characters.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String replace()</h1>
<script>
    var str = "Learn To Code For Free";
    var result = str.replace("Free", "WebTutor");
    document.write(result);
</script>

</body>
</html>

6. String replaceAll()

In place of the string to be replaced, you can supply a regular expression using the replaceAll() function. Must be global flag (g), JavaScript string set if parameter is regular expression; Otherwise, a TypeError is raised.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String replaceAll()</h1>
<script>
    var str = "color red looks brighter than color blue.";
    var result = str.replaceAll("color", "paint");
    document.write(result);
</script>

</body>
</html>

7. String toUpperCase()

Converts a string to uppercase.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String toUpperCase()</h1>
<script>
    var str = "Hello World!";
    var result = str.toUpperCase();
    document.write(result);
</script>

</body>
</html>

8. String toLowerCase()

Converts a string to lowercase.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String toLowerCase()</h1>
<script>
    var str = "WebTutor";
    var result = str.toLowerCase();
    document.write(result);
</script>

</body>
</html>

9. String concat()

Joins two or more strings and returns a new string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String concat()</h1>
<script>
    var str1 = "webtutor";
    var str2 = "dev";
    var result = str1.concat(".",str2)
    document.write(result);
</script>

</body>
</html>

10. String trim()

Removes whitespace from both ends of a string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String trim()</h1>
<script>
    var str = "    WebTutor     ";
    var result = str.trim();
    document.write("Length String = " + str.length + "<br>Length Result = " + result.length);
</script>

</body>
</html>

11. String trimStart()

Removes whitespace from the beginning of a string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String trimStart()</h1>
<script>
    var str = "    WebTutor     ";
    var result = str.trimStart();
    document.write("Length String = " + str.length + "<br>Length Result = " + result.length);
</script>

</body>
</html>

12. String trimEnd()

Removes whitespace from the end of a string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String trimEnd()</h1>
<script>
    var str = "    WebTutor     ";
    var result = str.trimEnd();
    document.write("Length String = " + str.length + "<br>Length Result = " + result.length);
</script>

</body>
</html>

13. String padStart()

Pads the beginning of a string with specified characters.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String padStart()</h1>
<script>
    var str = "12";
    var result = str.padStart(6, "x");
    document.write(result);
</script>

</body>
</html>

14. String padEnd()

Pads the end of a string with specified characters.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String padEnd()</h1>
<script>
    var str = "12";
    var result = str.padEnd(6, "x");
    document.write(result);
</script>

</body>
</html>

15. String charAt()

Returns the character at a specified index in a string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String charAt()</h1>
<script>
    var str = "WEBTUTOR";
    var result = str.charAt(2);
    document.write(result);
</script>

</body>
</html>

16. String charCodeAt()

Returns the Unicode of the character at a specified index in a string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String charCodeAt()</h1>
<script>
    var str = "WEBTUTOR";
    var result = str.charCodeAt(2);
    document.write(result);
</script>

</body>
</html>

17. String split()

Splits a string into an array of substrings based on specified characters.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String split()</h1>
<script>
    var str = "Webtutor.dev";
    var result = str.split(".");
    document.write(result[0]);
</script>

</body>
</html>

18. String search()

Searches a string for specified characters and returns the index of the first occurrence.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String search()</h1>
<script>
    var str = "Color red looks brighter than color blue.";
    var result = str.search("color");
    document.write(result);
</script>

</body>
</html>

19. String match()

Searches a string for specified characters and returns an array of matches.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String match()</h1>
<script>
    var str = "color red looks brighter than color blue.";
    var result = str.match("color");
    document.write(result.length + " " + result);
</script>

</body>
</html>

20. String matchAll()

Returns an iterator of all matches of a regular expression in a string.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String matchAll()</h1>
<script>
    var str = "color red looks brighter than color blue.";
    var result = str.matchAll("color");
    document.write(Array.from(result));
</script>

</body>
</html>

21. String includes()

Checks whether a string contains specified characters or not.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String includes()</h1>
<script>
    var str = "color red looks brighter than color blue.";
    var result = str.includes("color");
    document.write(result);
</script>

</body>
</html>

22. String startsWith()

Checks whether a string starts with specified characters or not.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String startsWith()</h1>
<script>
    var str = "Welcome to WebTutor";
    var result = str.startsWith("Welcome");
    document.write(result);
</script>

</body>
</html>

23. String endsWith()

Checks whether a string ends with specified characters or not.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String endsWith()</h1>
<script>
    var str = "Welcome to WebTutor";
    var result = str.endsWith("WebTutor");
    document.write(result);
</script>

</body>
</html>

24. String indexOf()

The index of (position of) the first instance of a string in a string is returned by the indexOf() function.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String indexOf()</h1>
<script>
    var str = "Welcome to WebTutor";
    var result = str.indexOf("WebTutor");
    document.write(result);
</script>

</body>
</html>

25. String lastIndexOf()

The lastIndexOf() function returns the string's string's index for the final instance of the provided text.

Example

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String lastIndexOf()</h1>
<script>
    var str = "Welcome to WebTutor";
    var result = str.lastIndexOf("WebTutor");
    document.write(result);
</script>

</body>
</html>

JS Strings

JS Strings Template