JavaScript String substr() Method

What You’ll Learn

String.prototype.substr() extracts characters by start index + length (same API as MDN String.prototype.substr()). Learn why it is deprecated, how negatives work, how it differs from slice() / substring(), five examples, and try-it labs.

Introduction

Need “start here, take this many characters”? That is what substr(start, length) does. It returns a new string and never changes the original.

Today you should reach for slice() instead. substr() is deprecated and optional outside browsers. Still, you will see it in older tutorials and codebases — so it helps to recognize the length-based API.

This page is part of JavaScript String Methods. Related topics include slice() and split().

Understanding the substr() Method

str.substr(start, length) copies length characters beginning at start. Omit length to take everything through the end.

• Returns a new string; the original is unchanged.
• Negative start counts from the end of the string.
• Negative length returns "".
• Prefer slice() for new code.

📝 Syntax

General form of String.prototype.substr:

str.substr(start)
str.substr(start, length)

Parameters

• start — index of the first character to include. Negatives count from the end. Omitted / undefined treated as 0. NaN treated as 0.
• length (optional) — how many characters to extract. Omit to go to the end. Negative length returns "". NaN treated as 0.

Return value

A string with the extracted characters:

Common patterns

"Mozilla".substr(1, 2);  // "oz"
"Mozilla".substr(2);     // "zilla"
"Mozilla".substr(-3);    // "lla"

// Prefer in new code:
"Mozilla".slice(1, 3);   // "oz"
"Mozilla".slice(2);      // "zilla"
"Mozilla".slice(-3);     // "lla"

Examples Gallery

Examples follow MDN String.substr() patterns. Use View Output or Try It Yourself for each case.

const str = "Mozilla";

str.substr(1, 2);
// "oz"

str.substr(2);
// "zilla"

oz
zilla

const string = "Mozilla";

string.substr(0, 1);  // "M"
string.substr(1, 0);  // ""
string.substr(1);     // "ozilla"
string.substr(20, 2); // ""

M
""
ozilla
""

const string = "Mozilla";

string.substr(-1, 1);   // "a"
string.substr(1, -1);   // ""
string.substr(-3);      // "lla"
string.substr(-20, 2);  // "Mo"

a
""
lla
Mo

const str = "01234";
const a = 1;
const l = -2;

str.substr(a, l);       // ""
str.slice(a, a + l);    // "123"
str.substring(a, a + l); // "0"

""
123
0

function firstN(str, n) {
  return str.slice(0, n);       // was: str.substr(0, n)
}

function fromIndex(str, i) {
  return str.slice(i);          // was: str.substr(i)
}

function lastN(str, n) {
  return str.slice(-n);         // was: str.substr(-n)
}

firstN("CodeToFun", 4);  // "Code"
fromIndex("Mozilla", 2); // "zilla"
lastN("Mozilla", 3);     // "lla"

Code
zilla
lla

🚀 Common Use Cases

• Reading legacy code — recognize start + length extraction.
• Migrating old scripts — rewrite to slice() carefully.
• Teaching differences — show length vs end-index APIs.
• Not for new apps — do not introduce substr() in fresh projects.
• Not HTML subscript — that is the deprecated sub() wrapper.
• Not delimiter splits — use split() for CSV / words.

📝 Notes

• substr() is deprecated (Annex B / web compatibility).
• The second argument is a length, not an end index.
• Negative length returns "" — unlike slice.
• Do not confuse with sub() (HTML) or substring() (two indexes).
• Blindly replacing with slice(a, a + l) can change behavior.
• Always capture the return value — the original string is unchanged.

💡 Best Practices