كيفية البدء بسرعة مع VUE3.0: أدخل التعلم
التوصيات ذات الصلة: برنامج تعليمي لـ JavaScript
التعبير العادي ( التعبير العادي، المشار إليه باسم regexp )
التطبيق: في تطوير المشروع، يمكن تنفيذ وظائف مثل إخفاء أرقام محددة من أرقام الهواتف المحمولة، وجمع البيانات، وتصفية الكلمات الحساسة، والتحقق من النماذج باستخدام التعبيرات العادية.
المجالات القابلة للتطبيق: في أنظمة التشغيل (يونكس، لينكس، إلخ)، لغات البرمجة (C، C++، Java، PHP، Python، JavaScript، إلخ).
على سبيل المثال: خذ البحث عن النص كمثال، إذا وجدت سلسلة تتطابق مع ميزة معينة (مثل رقم الهاتف المحمول) في كمية كبيرة من النص، فاكتب هذه الميزة وفقًا لبناء جملة التعبير العادي لتكوين النمط الذي يتعرف عليه برنامج الكمبيوتر (Pattern)، ثم يقوم برنامج الكمبيوتر بمطابقة النص وفقًا لهذا النمط للعثور على السلسلة التي تتوافق مع القواعد.
تاريخ التعبيرات العادية
شكل التعبير من التعبير العادي
أثناء التطوير، غالبًا ما يكون من الضروري البحث عن سلاسل محددة ومطابقتها بناءً على أنماط المطابقة العادية.
بالإضافة إلى استرداد القيمة المحددة في السلسلة، يمكن لأسلوب match () في كائن السلسلة أيضًا مطابقة كل المحتوى الذي يلبي المتطلبات في السلسلة الهدف وفقًا للقواعد العادية، وحفظه في مصفوفة بعد المطابقة ناجحة، وإرجاع خطأ إذا فشلت المطابقة.
في تطبيق JavaScript، تحتاج أولاً إلى إنشاء كائن عادي قبل استخدام التعبيرات العادية. بالإضافة إلى الإنشاء الحرفي الموضح سابقًا، يمكن أيضًا إنشاؤه من خلال مُنشئ كائن RegExp.
من أجل السماح للقراء بفهم كيفية الحصول على الكائنات العادية بشكل أفضل، سيتم تقديم شرح مقارن من خلال أخذ مطابقة الأحرف الخاصة "^" و"$" و"*" و"" و"" كمثال .
لاحظ أنه
على الرغم من أن الكائنات العادية التي تم إنشاؤها بواسطة الأسلوب المنشئ والأسلوب الحرفي متطابقتان تمامًا في الوظيفة، إلا أن لديهما اختلافات معينة في تنفيذ بناء الجملة. يحتاج النمط السابق إلى الهروب من الشرطة المائلة العكسية () عند استخدامه. عند كتابة النمط الأخير، يجب وضعه داخل الفاصل "/"، ويجب وضع علامة العلامات خارج محدد النهاية.
فوائد: الاستخدام الفعال لفئات الأحرف يمكن أن يجعل التعبيرات العادية أكثر إيجازًا وأسهل في القراءة.
مثال 1: يمكن تمثيل الأحرف الكبيرة والأحرف الصغيرة والأرقام مباشرة باستخدام "w".
الحالة 2: إذا كنت تريد مطابقة الأرقام بين 0 و9، فيمكنك استخدام "d".
من أجل تسهيل فهم القراء لاستخدام فئات الأحرف، يستخدم ما يلي "." و"s" كأمثلة للتوضيح.
تمثيل مجموعات الأحرف: يمكن لـ "[]" تنفيذ مجموعة أحرف.
نطاق الأحرف: عند استخدامه مع الواصلة "-"، فهذا يعني مطابقة الأحرف ضمن النطاق المحدد.
الأحرف المتضادة: عند استخدام الحرف التعريفي "^" مع "[]"، يطلق عليه الحرف المتضاد.
ليس ضمن نطاق معين: يتم استخدام "^" مع "[]" لمطابقة الأحرف التي لا تقع ضمن نطاق الأحرف المحدد.
خذ السلسلة 'get好TB6'.match(/pattern/g) كمثال لتوضيح استخدامها الشائع.
لاحظ
أن الحرف "-" يمثل عادةً حرفًا عاديًا فقط ويستخدم فقط
كحرف أولي عند تمثيل نطاق أحرف. النطاق الذي تمثله الواصلة "-" يتبع تسلسل ترميز الأحرف، على سبيل المثال، "aZ" و"za" و"a-9" كلها نطاقات غير قانونية.
[الحالة] الحد من محتوى الإدخال
فكرة تنفيذ الكود :
اكتب HTML، وقم بتعيين مربع نص للسنة (السنة) والشهر (الشهر)، وزر الاستعلام.
احصل على كائن العنصر للعملية وتحقق من إرسال النموذج.
التحقق من السنة بالشكل العادي: /^d{4}/. التحقق من الشهر القاعدة العادية: / ( ( 0 ? [ 1 − 9 ] ) ∣ ( 1 [ 012 ] ) ) /.
يتم التركيز على مربع النص وتتم إزالة لون مربع المطالبة. يفقد مربع النص التركيز، ويزيل المسافة البيضاء على طرفي محتوى الإدخال، ويتم التحقق من صحته.
تنفيذ التعليمات البرمجية
<أتش تي أم أل> <الرأس> <ميتا محارف = "UTF-8">الحد من محتوى الإدخال <نمط> الإدخال [النوع = النص] {العرض: 40 بكسل ؛ لون الحدود: #bbb ؛ الارتفاع: 25 بكسل ؛ حجم الخط: 14 بكسل ؛ نصف قطر الحدود: 2 بكسل ؛ المخطط التفصيلي: 0 ؛ الحدود: #ccc 1 بكسل صلب ؛ الحشو: 0 10 بكسل ؛ -انتقال webkit: مربع الظل .5s؛ الهامش السفلي: 15px؛} الإدخال [نوع = نص]: تحوم، إدخال [نوع = نص]: التركيز، إدخال [نوع = إرسال]: تحويم {border: 1px Solid #56b4ef؛ box-shadow: inset 0 1px 3px rgba(0,0,0, .05),0 0 8px rgba(82,168,236,.6); -webkit-transition: box-shadow .5s;} الإدخال::-webkit-input-placeholder {اللون: #999؛ -webkit-transition: color .5s;} الإدخال:التركيز::-webkit-input-placeholder، الإدخال:hover::-webkit-input-placeholder {color: #c2c2c2؛ -webkit-transition: color .5s;} الإدخال[نوع=إرسال]{الارتفاع: 30 بكسل; العرض: 80 بكسل; الخلفية: #4393C9; نمط> الرأس> <الجسم> <معرف النموذج = "النموذج"> السنة<نوع الإدخال = "نص" اسم = "السنة"> الشهر <نوع الإدخال = "نص" اسم = "شهر"> <نوع الإدخال = "إرسال" القيمة = "الاستعلام"> النموذج> <النص البرمجي> وظيفة checkYear(obj) { إذا (!obj.value.match(/^d{4}$/)) { obj.style.borderColor = 'أحمر'; result.innerHTML = 'خطأ في الإدخال، يتم تمثيل السنة بأربعة أرقام'; عودة كاذبة. } result.innerHTML = ''; عودة صحيحة؛ } دالة checkMonth(obj) { إذا (!obj.value.match(/^((0?[1-9])|(1[012]))$/)) { obj.style.borderColor = 'أحمر'; result.innerHTML = 'خطأ في الإدخال، الشهر يتراوح بين 1 و12'; عودة كاذبة. } result.innerHTML = ''; عودة صحيحة؛ } var form = document.getElementById('form'); // كائن العنصر