บทบาทของวงเล็บ [] ใน JavaScript Regular Expressions (Regex)

ใน JavaScript Regular Expressions วงเล็บเหลี่ยม [] ใช้สำหรับกำหนด "Character Class" (ชุดตัวอักษร) หรือ "Character Set" หมายถึง จับคู่ตัวอักษรใดตัวอักษรหนึ่งจากชุดที่กำหนด

รูปแบบพื้นฐาน

Pattern	ความหมาย	ตัวอย่าง Match
`[abc]`	จับคู่ 'a' หรือ 'b' หรือ 'c'	"a", "b", "c"
`[a-z]`	จับคู่ตัวอักษรพิมพ์เล็ก a ถึง z	"a", "m", "z"
`[A-Z]`	จับคู่ตัวอักษรพิมพ์ใหญ่ A ถึง Z	"A", "M", "Z"
`[0-9]`	จับคู่ตัวเลข 0 ถึง 9	"0", "5", "9"
`[a-zA-Z0-9]`	จับคู่ตัวอักษรและตัวเลข (Alphanumeric)	"a", "Z", "5"
`[^abc]`	Negated: จับคู่ตัวอักษร ยกเว้น a, b, c	"d", "1", "@"
`[a-z^]`	จับคู่ a-z และ ^ (เครื่องหมาย ^ ไม่ได้เป็น Negation ถ้าอยู่ไม่ใช่ตัวแรก)	"a", "^"

ตัวอักษรพิเศษภายใน [] (ไม่ต้อง Escape กว่านอก)

] ต้องเป็นตัวแรก (หรือ Escape) เพื่อจับคู่ตัวอักษร ] จริง: []] หรือ [\]]
^ ต้องไม่อยู่ตัวแรก เพื่อจับคู่ ^ จริง: [a^b]
- ต้องอยู่ตัวแรก/ตัวสุดท้าย/Escape เพื่อจับคู่ - จริง: [-ab], [ab-], [a\-b]
\ ใช้ Escape ตัวอักษรพิเศษอื่นๆ: [\$\.\*\+\?\|\{\}\[\]\\]

Shorthand Character Classes (ตัวย่อมาตรฐาน)

Shorthand	เทียบเท่า	คำอธิบาย
`\d`	`[0-9]`	Digit (ตัวเลข)
`\D`	`[^0-9]`	Non-Digit
`\w`	`[a-zA-Z0-9_]`	Word Character (ตัวอักษร, ตัวเลข, Underscore)
`\W`	`[^a-zA-Z0-9_]`	Non-Word Character
`\s`	`[ \t\r\n\f\v]`	Whitespace (Space, Tab, Newline, ฯลฯ)
`\S`	`[^ \t\r\n\f\v]`	Non-Whitespace

ตัวอย่างการใช้งาน

// 1. ตรวจสอบรหัสผ่าน: ต้องมีตัวเลขอย่างน้อย 1 ตัว
const hasDigit = /\d/.test("abc123"); // true

// 2. แทนที่ตัวอักษรพิเศษทั้งหมด (ยกเว้น Alphanumeric และ Space)
const clean = "Hello! @World#".replace(/[^\w\s]/g, ''); // "Hello World"

// 3. ดึงตัวเลขทั้งหมด
const numbers = "Price: $1,234.56".match(/\d+/g); // ["1", "234", "56"]

// 4. Validate Hex Color (#RRGGBB หรือ #RGB)
const hexColor = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/;
console.log(hexColor.test("#FFF"));   // true
console.log(hexColor.test("#FF5733")); // true
console.log(hexColor.test("#GGG"));   // false

// 5. Character Class กับ Quantifier
/[aeiou]{2,}/.test("hello"); // true (มีสระติดกัน 2+ ตัว: "ello" -> "e", "o" ไม่ติดกัน แต "oo" ใน "food" จะ true)

ข้อผิดพลาดทั่วไป

คิดว่า [] จับคู่ String: [abc] จับคู่ ตัวอักษรเดียว ไม่ใช่ "abc" → ใช้ (abc) สำหรับ Group
ลืม Escape - ใน []: [a-z-0-9] ผิด (Range a-z, ตัวอักษร -, 0-9) → ใช้ [a-z0-9-] หรือ [a-z\-0-9]
Negation ^ ไม่ได้วางต้น: [a^b] จับคู่ a, ^, b → [^ab] จับคู่ ยกเว้น a,b

หมายเหตุ: เนื้อหาเดิมกล่าวถึง Knockout.js observableArray

ใน Knockout.js [] ใช้สร้าง observableArray ซึ่งเป็น JavaScript Array Literal Syntax ไม่เกี่ยวกับ Regular Expression โดยตรง:

const myObservableArray = ko.observableArray([
  { name: "Bungle", type: "Bear" },
  { name: "George", type: "Hippo" }
]);

สรุป: ใน Regex [] = Character Class (จับคู่ตัวอักษรใดตัวหนึ่งในชุด) | ใน JS ทั่วไป [] = Array Literal