javascript
  1. javascript-substring

JavaScript substring()

The JavaScript substring() method is used to return a portion of a string, starting from the specified index position and to the end of the string or to the specified index position. It is a commonly used string manipulation method in JavaScript.

Syntax

string.substring(startIndex, endIndex)
  • startIndex: The index from which the extraction will begin. If the value is negative, it is treated as 0.
  • endIndex: The index position at which the extraction will end (up to, but not including). If the endIndex value is not specified, it will extract all characters from the startIndex to the end of the string.

Example

let s = "Hello World";
let sub1 = s.substring(1, 4); // "ell"
let sub2 = s.substring(4); // "o World"
let sub3 = s.substring(-3, 11); // "Hello Wor"
let sub4 = s.substring(12); // ""

Output

sub1 = "ell"
sub2 = "o World"
sub3 = "Hello Wor"
sub4 = ""

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>substring() Method Example</title>
</head>
<body>

<!-- Display area for the output -->
<div id="output"></div>

<script>
    // Your JavaScript code
    let s = "Hello World";

    // Using substring() method
    let sub1 = s.substring(1, 4);
    let sub2 = s.substring(4);
    let sub3 = s.substring(-3, 11);
    let sub4 = s.substring(12);

    // Display the output in the HTML document
    document.getElementById('output').innerHTML = `
        <p>s.substring(1, 4): "${sub1}"</p>
        <p>s.substring(4): "${sub2}"</p>
        <p>s.substring(-3, 11): "${sub3}"</p>
        <p>s.substring(12): "${sub4}"</p>
    `;
</script>

</body>
</html>
Try Playground

Explanation

In the above example, the substring() method is used on a string s with different arguments to extract a portion of the string. The first example extracts the portion of the string starting from index 1 and ending at index 4 (excluding character at index 4), which is "ell". The second example extracts the portion of the string starting from index 4 to the end, which is "o World". The third example extracts the portion of the string starting from index 0 (since the negative index is treated as 0) and ending at index 11 (excluding character at index 11), which is "Hello Wor". The fourth example extracts the portion of the string starting from index 12 to the end of the string, which is an empty string since there is no character beyond index 11.

Use

The substring() method in JavaScript is commonly used for string manipulation. It can be used to extract a portion of a string based on index positions or to validate user input strings.

Important Points

  • The substring() method does not modify the original string. Instead, it returns a new string that contains the extracted portion of the original string.
  • If the startIndex is greater than the endIndex, then the substring() method will swap the two values before extracting the portion of the string.
  • If either the startIndex or endIndex parameter is undefined or NaN, the substring() method will treat them as 0.

Summary

The substring() method is a useful string manipulation method in JavaScript that is used to extract a portion of a string. It accepts two parameters, the startIndex, and the endIndex, and returns a new string that contains the portion of the original string. It is widely used in various applications, including data validation, text processing, and string manipulations.

Published on: