التعامل مع الـ Regex (التعبيرات المنتظمة)

الدرس الثامن والعشرون: التعامل مع الـ Regex (التعبيرات المنتظمة)

التعبيرات المنتظمة (Regular Expressions أو Regex) هي أدوات قوية تُستخدم للبحث عن نمط معين في النصوص أو تعديلها بشكل ديناميكي. في JavaScript، يمكن استخدام التعبيرات المنتظمة للبحث، الاستبدال، والتحقق من وجود أنماط معينة في النصوص. في هذا الدرس، سنتناول كيفية استخدام التعبيرات المنتظمة في JavaScript.

1. التعريف بـ Regular Expressions

التعبير المنتظم (Regex) هو سلسلة نصية تحتوي على مجموعة من القواعد أو الأنماط التي تُستخدم للبحث أو التعامل مع النصوص. تُستخدم التعبيرات المنتظمة للقيام بالعديد من المهام مثل:

  • التحقق من صحة البيانات (مثل البريد الإلكتروني أو رقم الهاتف).
  • البحث عن نصوص تطابق نمط معين.
  • استبدال أو تعديل النصوص.

2. استخدام التعبيرات المنتظمة في البحث والاستبدال

البحث باستخدام التعبير المنتظم

في JavaScript، يمكن استخدام التعبير المنتظم للبحث عن نمط معين في النص باستخدام الدالة test() أو match().

  • test(): تُستخدم لاختبار ما إذا كان النمط موجودًا في النص أم لا. تُرجع true إذا تم العثور على تطابق، و false إذا لم يتم العثور على تطابق. const regex = /hello/; // تعبير منتظم يبحث عن كلمة "hello" const str = "hello world!"; const result = regex.test(str); // يُرجع true إذا تم العثور على "hello" console.log(result); // true
  • match(): تُستخدم لاستخراج جميع المطابقات للنمط في النص. const regex = /world/g; // "g" تعني البحث في جميع أنحاء النص const str = "hello world! welcome to the world!"; const matches = str.match(regex); console.log(matches); // ["world", "world"]

استبدال باستخدام التعبير المنتظم

يمكنك استخدام replace() لاستبدال النصوص التي تطابق النمط بنص آخر.

const regex = /world/g;  // التعبير المنتظم للبحث عن "world"
const str = "hello world! welcome to the world!";
const newStr = str.replace(regex, "everyone");
console.log(newStr);  // "hello everyone! welcome to the everyone!"

في هذا المثال:

  • يتم البحث عن كل ظهور لكلمة “world” في النص.
  • يتم استبدال كل ظهور بـ “everyone”.

3. التعبيرات المنتظمة في JavaScript

الأنماط الأساسية للتعبيرات المنتظمة

  • النقاط (.): تعني “أي حرف” باستثناء محارف السطر الجديد. const regex = /a.b/; const str = "acb"; console.log(regex.test(str)); // true لأن هناك "a" ثم أي حرف ثم "b"
  • الرموز المخصصة:
    • \d: يطابق أي رقم (من 0 إلى 9).
    • \D: يطابق أي محرف ليس رقمًا.
    • \w: يطابق أي حرف أو رقم أو underscore (أي محرف من [a-zA-Z0-9_]).
    • \W: يطابق أي محرف ليس حرفًا أو رقمًا أو underscore.
    • \s: يطابق أي مسافة فارغة (مثل الفراغ، التبويب، السطر الجديد).
    • \S: يطابق أي محرف ليس مسافة فارغة.
    مثال: const regex = /\d+/; // يبحث عن واحد أو أكثر من الأرقام const str = "123 abc"; console.log(str.match(regex)); // ["123"]
  • النمط المحدد:
    • ^: يطابق بداية السلسلة.
    • $: يطابق نهاية السلسلة.
    • {n}: يطابق العنصر السابق مكررًا n مرات.
    • *: يطابق العنصر السابق 0 أو أكثر من المرات.
    • +: يطابق العنصر السابق مرة واحدة أو أكثر.
    مثال: const regex = /^abc/; // يتأكد أن السلسلة تبدأ بـ "abc" const str = "abcdef"; console.log(regex.test(str)); // true

المجموعات (Parentheses) و الخيارات (Pipe)

  • (): تُستخدم لتجميع الأنماط في مجموعات.
  • |: يُستخدم للإشارة إلى “أو” (أو خيارين).

مثال:

const regex = /(cat|dog)/;  // يطابق "cat" أو "dog"
const str = "I have a cat";
console.log(regex.test(str));  // true

التكرار باستخدام الأقواس {}

تُستخدم الأقواس {} لتحديد عدد مرات تكرار العنصر:

  • {n}: يطابق العنصر بالضبط n مرات.
  • {n,}: يطابق العنصر n مرة أو أكثر.
  • {n,m}: يطابق العنصر بين n و m مرات.

مثال:

const regex = /\d{2,4}/;  // يطابق من 2 إلى 4 أرقام
const str = "2024";
console.log(regex.test(str));  // true

العلامات (Flags)

عند إنشاء التعبيرات المنتظمة، يمكنك إضافة علامات (Flags) لتعديل سلوك البحث. بعض العلامات الأكثر استخدامًا:

  • g: للبحث في النص بالكامل (Global search).
  • i: لتجاهل حالة الأحرف (Case-insensitive).
  • m: للبحث عبر الأسطر المتعددة.

مثال:

const regex = /hello/i;  // "i" تعني البحث بدون اعتبار لحالة الأحرف
const str = "Hello world!";
console.log(regex.test(str));  // true لأن البحث لا يأخذ في الاعتبار الحالة

4. أمثلة متقدمة لاستخدام التعبيرات المنتظمة

التحقق من صحة البريد الإلكتروني باستخدام Regex

const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
const email = "user@example.com";
console.log(regex.test(email));  // true

التحقق من صحة رقم الهاتف

const regex = /^\+?[0-9]{1,4}?[-.\s]?[0-9]{1,4}[-.\s]?[0-9]{1,9}$/;
const phone = "+123-456-7890";
console.log(regex.test(phone));  // true

الخلاصة

  • التعبيرات المنتظمة (Regex) هي أدوات قوية تستخدم للبحث عن الأنماط أو تعديل النصوص في JavaScript.
  • يمكنك استخدام التعبيرات المنتظمة في العديد من العمليات مثل البحث، الاستبدال، والتحقق من البيانات.
  • تمثل التعبيرات المنتظمة نمطًا من الأحرف أو الرموز يمكن استخدامها للتطابق مع أجزاء معينة من النصوص.
  • يمكن إضافة علامات (مثل g و i و m) لتعديل كيفية عمل التعبيرات المنتظمة.
  • تعتبر التعبيرات المنتظمة مثالية في عمليات التحقق من البيانات (مثل البريد الإلكتروني أو رقم الهاتف) أو البحث في نصوص ضخمة.

مع Regex في JavaScript، يمكنك تحسين الكود وتحقيق أداء عالي عند التعامل مع النصوص.


اكتشاف المزيد من كود التطور

اشترك للحصول على أحدث التدوينات المرسلة إلى بريدك الإلكتروني.

اترك رد

Scroll to Top