التعبيرات المنتظمة في JavaScript مع أمثلة للمبتدئين

مدرب بايثون أونلاين للمبتدئين

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

ابدأ الدورة

مقدمة في التعبيرات المنتظمة في JavaScript

\n

التعبيرات المنتظمة (regex أو regexp) هي أداة قوية للبحث والاستبدال والتحقق من السلاسل النصية وفق نمط محدد. في JavaScript (و Node.js) يتم تنفيذها من خلال الكائن المدمج RegExp.

\n

قد يبدو تركيب regex مخيفًا للمبتدئين، لكنه في الواقع مجرد لغة لوصف الأنماط. بإتقان التركيبات الأساسية، ستتمكن من:

\n
    \n
  • التحقق من صحة البريد الإلكتروني، رقم الهاتف، URL
  • \n
  • استخراج البيانات من النص (تحليل)
  • \n
  • استبدال السلاسل الفرعية وفق قواعد معقدة
  • \n
  • تصفية ومعالجة إدخال المستخدم
  • \n
\n

في هذه المقالة سنشرح التعبيرات المنتظمة في JavaScript مع أمثلة على Node.js. يمكن تشغيل جميع الأمثلة في وحدة التحكم أو في بيئة التشغيل.

\n\n

إنشاء تعبير منتظم في JS

\n

هناك طريقتان لإنشاء regex في JavaScript:

\n

1. الصيغة الحرفية (موصى بها)

\n
const pattern = /hello/;  // يبحث عن كلمة "hello"
\n

يتم وضع النمط بين شرطتين مائلتين. بعد الشرطة المائلة الختامية يمكن تحديد العلامات (مثل i — بحث غير حساس لحالة الأحرف).

\n\n

2. المُنشئ RegExp

\n
const pattern = new RegExp('hello');  // مشابه لـ /hello/
\n

يُستخدم عندما يكون النمط ديناميكيًا (يتم تكوينه من متغير).

\n\n

علامات التعبيرات المنتظمة

\n
    \n
  • i — تجاهل حالة الأحرف (/hello/i سيجد "Hello", "HELLO")
  • \n
  • g — بحث عام (يبحث عن جميع التطابقات، وليس الأولى فقط)
  • \n
  • m — وضع متعدد الأسطر (تغيير سلوك المراسي ^ و $)
  • \n
  • s — النقطة تطابق حرف السطر الجديد
  • \n
  • u — دعم Unicode
  • \n
  • y — بحث لاصق (يبحث فقط من موضع lastIndex)
  • \n
\n
const regex = /javascript/gi;  // يبحث عن "javascript" بشكل عام ودون تمييز حالة الأحرف
\n\n

الطرق الأساسية للعمل مع regex في JavaScript

\n

دعنا نستعرض الطرق الرئيسية المستخدمة مع التعبيرات المنتظمة.

\n\n

test() — التحقق من وجود النمط

\n

تُرجع true أو false. أسرع طريقة للتحقق من الصحة.

\n
const emailPattern = /^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,}$/i;\nconsole.log(emailPattern.test('user@example.com')); // true\nconsole.log(emailPattern.test('invalid-email'));    // false
\n\n

exec() — بحث مع تفاصيل

\n

تُرجع مصفوفة تحتوي على التطابق والمجموعات. مع العلامة g تتذكر الموضع.

\n
const str = 'السعر: 100 روبل، الخصم: 20 روبل';\nconst pricePattern = /(\\d+)\\sروبل/g;\nlet match;\nwhile ((match = pricePattern.exec(str)) !== null) {\n  console.log(`تم العثور على: ${match[0]}, الرقم: ${match[1]}`);\n}\n// الإخراج:\n// تم العثور على: 100 روبل, الرقم: 100\n// تم العثور على: 20 روبل, الرقم: 20
\n\n

match() — بحث في السلسلة النصية

\n

طريقة السلسلة النصية. بدون العلامة g تُرجع أول تطابق (مثل exec). مع العلامة g — مصفوفة بجميع التطابقات.

\n
const text = 'JS هو JavaScript، لا تخلطه مع Java.';\nconst jsMatches = text.match(/Java\\w*/g);\nconsole.log(jsMatches); // ['JavaScript', 'Java']
\n\n

replace() — استبدال وفق النمط

\n

يستبدل التطابقات بسلسلة نصية جديدة. يدعم الرموز الخاصة ($1, $&).

\n
const phone = '+7 (123) 456-78-90';\nconst cleanPhone = phone.replace(/[\\s\\(\\)\\-]/g, '');\nconsole.log(cleanPhone); // +71234567890\n\n// استبدال باستخدام المجموعات\nconst date = '2024-03-15';\nconst reversed = date.replace(/(\\d{4})-(\\d{2})-(\\d{2})/, '$3.$2.$1');\nconsole.log(reversed); // 15.03.2024
\n\n

search() — فهرس أول تطابق

\n
const index = 'Hello world'.search(/world/);\nconsole.log(index); // 6                

المدونات

توصيات الكتب