Apa itu Anchor?
Anchor tidak mencocokkan karakter tertentu — mereka mencocokkan posisi di dalam string. Anchor memastikan pattern kamu ditemukan di lokasi yang tepat.
^ — Awal String
Caret ^ (di luar character class) memastikan pattern ada di awal string:
/^Halo/.test("Halo dunia"); // true
/^Halo/.test("Dia bilang Halo"); // false
// Berguna untuk validasi
/^[A-Z]/.test("Budi"); // true (dimulai huruf besar)
/^[A-Z]/.test("budi"); // false
$ — Akhir String
Dollar $ memastikan pattern ada di akhir string:
/dunia$/.test("Halo dunia"); // true
/dunia$/.test("dunia ini"); // false
// Cek ekstensi file
/\.js$/.test("app.js"); // true
/\.js$/.test("app.js.bak"); // false
Kombinasi ^ dan $ — Full Match
Menggunakan keduanya memastikan seluruh string cocok dengan pattern (bukan hanya sebagian):
// Tanpa anchor — cocok di mana saja
/\d+/.test("abc123def"); // true
// Dengan kedua anchor — seluruh string harus cocok
/^\d+$/.test("abc123def"); // false
/^\d+$/.test("123456"); // true
// Validasi input form
const isValidAge = /^\d{1,3}$/.test("25"); // true
const isInvalid = /^\d{1,3}$/.test("25 tahun"); // false
\b — Word Boundary
Word boundary \b cocok di posisi antara word character (\w) dan non-word character (atau awal/akhir string):
// Tanpa boundary — "cat" ditemukan di "concatenate"
/cat/.test("concatenate"); // true 😬
// Dengan boundary — hanya kata "cat" yang berdiri sendiri
/\bcat\b/.test("concatenate"); // false ✓
/\bcat\b/.test("the cat sat"); // true ✓
/\bcat\b/.test("cat"); // true ✓
// Awal kata saja
/\bpro/.test("programming"); // true
/\bpro/.test("improve"); // false ("pro" bukan di awal kata)
\B — Non-Word Boundary
Kebalikan dari \b — cocok di posisi yang bukan word boundary:
/\Bcat/.test("concatenate"); // true (cat di tengah kata)
/\Bcat/.test("cat"); // false (cat di awal kata = boundary)
Multiline Mode (m flag)
Dengan flag m, ^ dan $ cocok di awal/akhir setiap baris (bukan hanya awal/akhir seluruh string):
const multiline = `baris pertama
baris kedua
baris ketiga`;
// Tanpa flag m — hanya baris pertama
multiline.match(/^baris/); // ["baris"] (di "baris pertama")
// Dengan flag m — setiap baris
multiline.match(/^baris/gm); // ["baris", "baris", "baris"]
// Temukan kata terakhir di setiap baris
multiline.match(/\w+$/gm); // ["pertama", "kedua", "ketiga"]
Contoh Praktis
// Validasi username: huruf/angka/underscore, 3-16 karakter
const usernameValid = /^[a-zA-Z0-9_]{3,16}$/.test("dev_user42");
console.log(usernameValid); // true
// Cari seluruh kata "di" (bukan bagian dari kata lain)
const teks = "Dia pergi di malam hari menuju kediaman raja";
console.log(teks.match(/\bdi\b/gi)); // ["di"]
// Cek apakah baris dimulai dengan komentar
const code = `const x = 1;
// ini komentar
const y = 2;`;
console.log(code.match(/^\/\/.+/gm)); // ["// ini komentar"]
🎭 Analogi sehari-hari: Anchor = tanda check di formulir. ^ = "tanda awal halaman" (cuma valid di awal). $ = "tanda akhir halaman" (cuma valid di akhir). \b = "spasi antar kata" (transisi). Anchor gak konsumsi karakter — cuma cek posisi. Bayangin tukang pos: bukan periksa isi surat, tapi cek alamat tujuan ada di stempel awal/akhir.
💡 ^ punya 2 makna berbeda:
- Outside
[]: anchor (start of line) - Inside
[^...]posisi pertama: negasi class
Sama simbol, beda context. Sumber bug pemula. Cara hafal: kalau di luar [] = posisi, di dalam = negasi.
⚠️ Jebakan klasik:
- Pakai
^...$tanpa flagmdi multiline string = cocok seluruh string sebagai 1, bukan per line \bcocok di transisi word/non-word — termasuk start/end string.\bword\bmungkin gak match kalau ada quote di tepi- Lupa anchor di validasi —
/\d+/.test("abc123")= true (cocok 123). Pakai/^\d+$/untuk validasi penuh $di multiline mode = end of line, bukan end of string. Pakai\zdi bahasa yang support kalau butuh end-of-string strict
🎯 Pattern dengan anchor:
- Validasi format penuh:
^pattern$ - Cari kata utuh:
\bword\b(gak match dalam kata lain) - Match per line:
^patterndengan flagm - Indent line:
^\s+denganm - Empty line:
^$denganm
TL;DR: Anchor = match posisi, bukan karakter. ^ start, $ end, \b word boundary. Wajib untuk validasi penuh (^...$). Multiline mode (m flag) ubah meaning ^ & $ jadi per-line. \b cegah match dalam kata lain.