Skip to main content

JavaScript Regular Expressions

JavaScript Regex Anchors

Written by Published

Anchors tie a pattern to the start or end of the text.

Without anchors, a pattern can match anywhere inside the text.

That is the single biggest cause of validation letting bad input through.

Example

Example

javascript

console.log(/\d{4}/.test("year 2026 here"));
console.log(/^\d{4}$/.test("year 2026 here"));

The output is true then false.

Only the anchored pattern insists the whole text is four digits.

The Anchors

^ matches the start of the text.

$ matches the end.

\b matches a word boundary.

Syntax

Syntax

javascript

/^start/
/end$/
/^whole$/

Use both for validation, so the whole value must match.

Why Validation Needs Anchors

Without them, anything containing a valid part passes.

Example

Example

javascript

const pattern = /\d{4}/;
const anchored = /^\d{4}$/;

console.log(pattern.test("abc2026xyz"));
console.log(anchored.test("abc2026xyz"));
console.log(anchored.test("2026"));

Only the last one should be accepted as a year.

Start and End Separately

Sometimes only one end matters.

Example

Example

javascript

console.log(/^https/.test("https://example.com"));
console.log(/\.pdf$/.test("report.pdf"));
console.log(/\.pdf$/.test("report.pdf.exe"));

Anchoring the end is how you check a file extension safely.

Word Boundaries

\b sits between a word character and a non-word character.

It stops a short word matching inside a longer one.

Example

Example

javascript

console.log(/cat/.test("concatenate"));
console.log(/\bcat\b/.test("concatenate"));
console.log(/\bcat\b/.test("a cat sat"));

The output is true, false, true.

Counting Whole Words

Boundaries make a word count accurate.

Example

Example

javascript

const text = "cat concatenate cat";

console.log(text.match(/cat/g).length);
console.log(text.match(/\bcat\b/g).length);

The output is 3 then 2.

The Caret Means Two Things

Outside brackets it anchors to the start.

Inside brackets it inverts the set, which is a common confusion.

Example

Example

javascript

console.log(/^a/.test("abc"));
console.log(/[^a]/.test("abc"));

Both are true, for completely different reasons.

Complete Example

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Regex Anchors</title>
</head>
<body>

  <h1>Regex Anchors</h1>

  <p id="out"></p>

  <script>
    const value = "abc2026xyz";

    document.getElementById("out").innerHTML =
      "Unanchored accepts it: " + /\d{4}/.test(value) +
      "<br>Anchored accepts it: " + /^\d{4}$/.test(value) +
      "<br>Anchored accepts 2026: " + /^\d{4}$/.test("2026") +
      "<br>Whole word cat in concatenate: " + /\bcat\b/.test("concatenate");
  </script>

</body>
</html>

Try It Yourself

Run the above example in the Try It Editor.

Try removing an anchor:

Drop the $ and see what starts passing.

Important Points

  • ^ anchors to the start and $ to the end.
  • Validation should use both.
  • \b marks a word boundary.
  • Boundaries stop short words matching inside longer ones.
  • A caret inside brackets inverts instead of anchoring.

Conclusion

Forgetting anchors is the most common validation bug there is.

A pattern without them asks does this contain, not is this.

Word boundaries make text searching far more accurate.