How to Use the substr Method in JavaScript

The substr() method extracts a part of a string from the larger whole.

Note: Be careful to not confuse substr() with the substring() method!

The example below demonstrates how to use substr() to extract a portion of a string:

const str = "Make a cut!";
console.log(str.substr(7, 3));
// Expected output: cut

In the example above the substr() method is being used to extract a certain part of the str String. The value returned starts at index 7, and proceeds for 3 more characters if they are available.

The substr() method returns a new string as its result.

Note: JavaScript strings are immutable – substr() creates a new string in memory upon completion.

Syntax

The syntax of the substr() method is as follows:

String.substr(startIndex, length)

startIndex: the index at which to start the extraction.

length (optional): the number of characters to include in the extraction.

Note: the length parameter is optional. When omitted, the substr() method will extract characters from the startIndex to the end of the String it operates upon.

Note: A String’s index begins at zero.

String.length is equal to the index of the last character in the string + 1. This means that in order to retrieve the last character in a string, you need to use str.length – 1 to get the last index:

console.log(str[str.length - 1]);
// Expected output: !

The example above returns the last character in our original test string, which is an exclamation mark.

Special cases for the substr() method

There are a few special cases in the behavior of the substr() method that need additional explanation:

• When the startIndex is negative, the starting point of the substr() method is found by counting from the end of the String being operated upon:

const str = "Make a cut!";
console.log(str.substr(-6, 1));
// Expected output: a

In the example above, the extraction begins from str’s end (because a negative number is assigned to the startIndex parameter), counting back six characters, then extracting a single character. If the length parameter was omitted, all of the last six characters would be printed to the console.

• If the length provided is greater than String.length, the substr() method will treat it as String.length.
• Any argument which includes a decimal point will be rounded down (i.e. 6.72 will be converted to 6).
• Any value which is not a number (NaN) will be regarded as zero.

const str = "Make a cut!";
console.log(str.substr('start', 4.7));
// Expected output: Make

In the example above, the argument ‘start’ is not a number, therefore, the operation conducted by substr() begins from index zero in the str variable and count the next 4 characters (as 4.7 is rounded down).

• If no arguments are passed in, and both parameters are omitted, the substr() method returns a copy of the String it operates upon.

Similar methods

• substring() method
• slice() method

Related Articles

JavaScript – How to Use the toString method

JavaScript – How to Use the indexOf method

JavaScript – How to Use the String.prototype replace Method