Kelas-kelas Karakter (Character classes)

Bayangkan sebuah tugas praktik – kita memiliki sebuah nomor telepon "+7(903)-123-45-67", dan kita harus mengubah nomor telepon tersebut menjadi angka murni: 79031234567.

Untuk melakukan hal itu, kita harus menemukan apapun yang bukan merupakan angka. Kelas karakter dapat membantu membereskan hal tersebut.

Sebuah Kelas Karakter adalah sebuah notasi yang spesial yang membandingkan simbol apapun dengan aturan tertentu.

Untuk memulai, ayo kita explore kelas “angka” (digit). Kelas “angka” ditulis seperti \d dan dapat disamakan dengan “setiap angka yang ada”.

Untuk contoh, kita akan mencoba mencari angka pertama pada nomor telepon:

let str = "+7(903)-123-45-67";

let regexp = /\d/;

alert( str.match(regexp) ); // 7

Tanpa tanda g, ekspresi regularnya hanya akan mencari satu kecocokan, yaitu angka pertama \d.

Coba kita tambahkan tanda g untuk mencari seluruh angka:

let str = "+7(903)-123-45-67";

let regexp = /\d/g;

alert( str.match(regexp) ); // array: 7,9,0,3,1,2,3,4,5,6,7

// kita coba untuk membuat "hanya angka" dari nomor teleponnya:
alert( str.match(regexp).join('') ); // 79031234567

Itu adalah kelas karakter untuk angka. Tentu saja ada karakter kelas lainnya.

Yang paling banyak digunakan adalah:

\d (“d” untuk “digit” / “angka”)

Angka: adalah karakter dari 0 sampai 9.

\s (“s” untuk “space” / “spasi” / untuk mencari whitespace)

Simbol space / spasi: termasuk spasi, tabs \t, garis baru \n dan beberapa karakter lainnya yang jarang digunakan, seperti \v, \f dan \r.

\w (“w” untuk “word” / “karakter kata”)

“karakter kata”: antara sebuah huruf dari alfabet latin atau sebuah angka atau sebuah underscore _ (a-z, A-Z, 0-9). \w tidak bisa digunakan untuk huruf yang bukan huruf latin (seperti cyrillic atau hindi).

Contohnya, \d\s\w menandakan sebuah “digit” yang diikuti dengan “karakter space” diikuti dengan “karakter kata”, seperti 1 a.

Regular ekspresi mungkin mengandung simbol dan kelas karakter.

Contoh, CSS\d cocok dengan string CSS dengan angka setelahnya:

let str = "Apakah CSS4 telah rilis?";
let regexp = /CSS\d/

alert( str.match(regexp) ); // CSS4

Dan juga kita bisa menggunakan banyak kelas karakter:

alert( "I love HTML5!".match(/\s\w\w\w\w\d/) ); // ' HTML5'

Kecocokannya (setiap karakter kelas regexp yang menghasilkan hasil yang sesuai):

Kelas kebalikan (Inverse Classes)

Untuk setiap kelas karakter yang ada terdapat sebuah “kelas kebalikan”, ditunjukan dengan huruf yang sama, tapi dengan huruf besar / kapital.

“Kebalikan” berarti kelas tersebut cocok dengan seluruh karakter lainnya, contoh:

\D

Bukan angka: karakter apapun kecuali \d, contoh huruf.

\S

Bukan spasi: karakter apapun kecuali \s, contoh huruf.

\W

Bukan karakter kata: apapun kecuali \w, contoh huruf yang bukan latin atau sebuah spasi.

Pada awal bab kita melihat bagaimana cara membuat nomor telepon yang hanya angka dari string seperti +7(903)-123-45-67: cari seluruh angka dan gabungkan.

let str = "+7(903)-123-45-67";

alert( str.match(/\d/g).join('') ); // 79031234567

Alternatif, cara pendeknya adalah dengan mencari karakter yang bukan angka dan hilangkan dari stringnya:

let str = "+7(903)-123-45-67";

alert( str.replace(/\D/g, "") ); // 79031234567

Sebuah titik adalah “karakter apapun”

Sebuah titik . adalah sebuah kelas karakter spesial yang cocok “dengan karakter apapun kecuali garis baru”.

Contoh:

alert( "Z".match(/./) ); // Z

Atau ditengah dari sebuah ekspresi regular:

let regexp = /CS.4/;

alert( "CSS4".match(regexp) ); // CSS4
alert( "CS-4".match(regexp) ); // CS-4
alert( "CS 4".match(regexp) ); // CS 4 (spasi juga merupakan karakter)

Ingatlah bahwa titik berarti “karakter apapun”, tapi bukan sebuah “ketiadaan karakter”. Harusnya ada karakter yang mirip dengannya:

alert( "CS4".match(/CS.4/) ); // null, tidak ada yang cocok karena tidak terdapat karakter untuk titiknya.

Titik secara literal adalah karakter apapun dengan tanda “s”

Pada dasarnya, sebuah titik tidak cocok dengan karakter garis baru \n.

Contoh, ekspresi regular A.B cocok dengan A, dan lalu B dengan karakter apapun diantaranya, kecuali garis baru \n:

alert( "A\nB".match(/A.B/) ); // null (tidak ada yang cocok)

Terdapat beberapa situasi ketika kita ingin memperlakukan titik sebagai “karakter apapun”, garis baru termasuk.

Itulah yang dilakukan oleh s. Jika sebuah ekspresi regular memilikinya, maka sebuah titik . secara literal cocok dengan karakter apapun:

alert( "A\nB".match(/A.B/s) ); // A\nB (cocok!)

alert( "A\nB".match(/A[\s\S]B/) ); // A\nB (cocok!)

alert( "1 - 5".match(/\d-\d/) ); // null, tidak cocok!

alert( "1 - 5".match(/\d - \d/) ); // 1 - 5, sekarang pencocokannya bekerja
// atau kita bisa menggunakan kelas \s:
alert( "1 - 5".match(/\d\s-\s\d/) ); // 1 - 5, juga bekerja

Ringkasan

Terdapat karakter kelas:

• \d – digits / Angka.
• \D – non-digits / Bukan angka.
• \s – simbol spasi, tabs, garis baru.
• \S – semuanya kecuali \s.
• \w – huruf latin, angka, underscore '_'.
• \W – semuanya kecuali \w.
• . – karakter apapun jika dengan regexp tanda 's', sebaliknya semuanya kecuali sebuah garis baru \n.

…Tapi ini belum semuanya!

Unicode encoding, digunakan oleh Javascript untuk string, menyediakan berbagai properti untuk karakter, seperti: bahasa mana yang cocok dengan surat ini (jika sebuah surat), tanda bacanya, dll.

We can search by these properties as well. That requires flag u, covered in the next article. Tentu saja kita bisa mencari dengan propertinya. Yang mana membutuhkan tanda u, yang akan dibahas didalam bab selanjutnya.