تعبيرات جافا سكريبت العادية، هذه المقالة كافية

كيفية البدء بسرعة مع VUE3.0: أدخل التعلم

التوصيات ذات الصلة: برنامج تعليمي لـ JavaScript

ما هو التعبير العادي

التعبير العادي ( التعبير العادي، المشار إليه باسم regexp )

• هو قاعدة نحوية تصف بنية السلسلة.
• وهو نمط تنسيق محدد يُستخدم للتحقق مما إذا كانت السلاسل المختلفة تتطابق مع هذه الميزة، وبالتالي تمكين البحث المتقدم عن النص والاستبدال واعتراض المحتوى وعمليات أخرى.

التطبيق: في تطوير المشروع، يمكن تنفيذ وظائف مثل إخفاء أرقام محددة من أرقام الهواتف المحمولة، وجمع البيانات، وتصفية الكلمات الحساسة، والتحقق من النماذج باستخدام التعبيرات العادية.

المجالات القابلة للتطبيق: في أنظمة التشغيل (يونكس، لينكس، إلخ)، لغات البرمجة (C، C++، Java، PHP، Python، JavaScript، إلخ).

على سبيل المثال: خذ البحث عن النص كمثال، إذا وجدت سلسلة تتطابق مع ميزة معينة (مثل رقم الهاتف المحمول) في كمية كبيرة من النص، فاكتب هذه الميزة وفقًا لبناء جملة التعبير العادي لتكوين النمط الذي يتعرف عليه برنامج الكمبيوتر (Pattern)، ثم يقوم برنامج الكمبيوتر بمطابقة النص وفقًا لهذا النمط للعثور على السلسلة التي تتوافق مع القواعد.

تاريخ التعبيرات العادية

شكل التعبير من التعبير العادي

• أحدهما عبارة عن تعبير عادي متوافق مع مواصفات POSIX يُستخدم لضمان إمكانية النقل بين أنظمة التشغيل.
• أحدهما هو أنه عندما تم تطوير لغة Perl (لغة برمجة غنية بالميزات)، تم اشتقاق تعبيرات Perl العادية، حيث يعتمد بناء الجملة العادي في JavaScript على لغة Perl.

كيفية استخدام التعبيرات العادية

أثناء التطوير، غالبًا ما يكون من الضروري البحث عن سلاسل محددة ومطابقتها بناءً على أنماط المطابقة العادية.

طريقة exec ()

• يتم استخدام طريقة exec () للبحث عن التطابقات في السلسلة الهدف، وإرجاع نتيجة مطابقة واحدة فقط في المرة الواحدة.
• على سبيل المثال، ابحث عن abc في السلسلة المحددة.

• "/" في "/abc/i" هو محدد التعبير العادي، ويمثل "abc" نص النمط للتعبير العادي، و"i" هو معرف تعديل النمط، مما يعني أنه تم تجاهل هذه الحالة في str.
• معلمة طريقة exec () هي سلسلة السلسلة المراد مطابقتها. عندما تنجح المطابقة، تكون القيمة المرجعة لهذه الطريقة عبارة عن مصفوفة، وإلا فإنها تُرجع فارغة.
• يمكن أن نرى من نتيجة إرجاع exec() أن العنصر الأول (AbC) المحفوظ في المصفوفة يمثل السلسلة المتطابقة؛ يمثل فهرس العنصر الثاني قيمة فهرس الحرف المطابق في السلسلة الهدف (من البداية إلى 0) يمثل إدخال المعلمة الثالثة السلسلة المستهدفة (AbC123abc456).

طريقة match ()

بالإضافة إلى استرداد القيمة المحددة في السلسلة، يمكن لأسلوب match () في كائن السلسلة أيضًا مطابقة كل المحتوى الذي يلبي المتطلبات في السلسلة الهدف وفقًا للقواعد العادية، وحفظه في مصفوفة بعد المطابقة ناجحة، وإرجاع خطأ إذا فشلت المطابقة.

• يمكن استخدام محدد الموقع "^" لمطابقة بداية السلسلة.
• يمكن استخدام محدد الموقع "$" لمطابقة نهاية السلسلة.
• يمثل g تطابقًا عامًا، يُستخدم لمتابعة البحث بعد العثور على التطابق الأول.

الحصول على كائن عادي

في تطبيق JavaScript، تحتاج أولاً إلى إنشاء كائن عادي قبل استخدام التعبيرات العادية. بالإضافة إلى الإنشاء الحرفي الموضح سابقًا، يمكن أيضًا إنشاؤه من خلال مُنشئ كائن RegExp.

• النمط هو نص نمط تعبير عادي يتكون من أحرف أولية وأحرف حرفية.
• الأحرف الأولية هي أحرف ذات معاني خاصة، مثل "^" أو "" أو "*".
• أحرف النص هي نص عادي، مثل الحروف والأرقام.
• تمثل الأعلام معرف تعديل النمط، والذي يستخدم لتعيين التعبير العادي بشكل أكبر.
  
  

• يمكن أيضًا استخدام معدّلات الوضع في مجموعات متعددة وفقًا للاحتياجات الفعلية.
• على سبيل المثال، لتجاهل حالة الأحرف والمطابقة عالميًا، يمكنك استخدام gi مباشرةً، ولا توجد متطلبات ترتيب عند كتابة معدلات أنماط متعددة.
• لذلك، فإن الاستخدام المعقول لمعدلات الأنماط يمكن أن يجعل التعبيرات العادية أكثر إيجازًا وبديهية.

من أجل السماح للقراء بفهم كيفية الحصول على الكائنات العادية بشكل أفضل، سيتم تقديم شرح مقارن من خلال أخذ مطابقة الأحرف الخاصة "^" و"$" و"*" و"" و"" كمثال .

• المحدد "|" يعني "أو"، ويمكن تحديد شرط البحث طالما تم استيفاء أحد الشروط.
• هناك مشكلة هروب مع السلاسل في JavaScript، لذا فإن "" في str في الكود يمثل شرطة مائلة عكسية "".
• عند مطابقة أحرف خاصة في التعبيرات العادية، تكون هناك حاجة أيضًا إلى خطوط مائلة عكسية () للهروب من الأحرف الخاصة. على سبيل المثال، "\" يصبح "" بعد هروب السلسلة، ثم يستخدم التعبير العادي "" لمطابقة "".

لاحظ أنه

على الرغم من أن الكائنات العادية التي تم إنشاؤها بواسطة الأسلوب المنشئ والأسلوب الحرفي متطابقتان تمامًا في الوظيفة، إلا أن لديهما اختلافات معينة في تنفيذ بناء الجملة. يحتاج النمط السابق إلى الهروب من الشرطة المائلة العكسية () عند استخدامه. عند كتابة النمط الأخير، يجب وضعه داخل الفاصل "/"، ويجب وضع علامة العلامات خارج محدد النهاية.

فئات الأحرف

: الاستخدام الفعال لفئات الأحرف يمكن أن يجعل التعبيرات العادية أكثر إيجازًا وأسهل في القراءة.

مثال 1: يمكن تمثيل الأحرف الكبيرة والأحرف الصغيرة والأرقام مباشرة باستخدام "w".

الحالة 2: إذا كنت تريد مطابقة الأرقام بين 0 و9، فيمكنك استخدام "d".

من أجل تسهيل فهم القراء لاستخدام فئات الأحرف، يستخدم ما يلي "." و"s" كأمثلة للتوضيح.

• يتم استخدام كائن reg العادي لمطابقة أي حرفين بعد حرف المسافة البيضاء (باستثناء الأسطر الجديدة).
• لذلك، في النتائج المعروضة على وحدة التحكم، هناك مسافة قبل المعرف.

مجموعة الأحرف

تمثيل مجموعات الأحرف: يمكن لـ "[]" تنفيذ مجموعة أحرف.

نطاق الأحرف: عند استخدامه مع الواصلة "-"، فهذا يعني مطابقة الأحرف ضمن النطاق المحدد.

الأحرف المتضادة: عند استخدام الحرف التعريفي "^" مع "[]"، يطلق عليه الحرف المتضاد.

ليس ضمن نطاق معين: يتم استخدام "^" مع "[]" لمطابقة الأحرف التي لا تقع ضمن نطاق الأحرف المحدد.

خذ السلسلة 'get好TB6'.match(/pattern/g) كمثال لتوضيح استخدامها الشائع.

لاحظ

أن الحرف "-" يمثل عادةً حرفًا عاديًا فقط ويستخدم فقط

كحرف أولي عند تمثيل نطاق أحرف. النطاق الذي تمثله الواصلة "-" يتبع تسلسل ترميز الأحرف، على سبيل المثال، "aZ" و"za" و"a-9" كلها نطاقات غير قانونية.

[الحالة] الحد من محتوى الإدخال

فكرة تنفيذ الكود :

اكتب HTML، وقم بتعيين مربع نص للسنة (السنة) والشهر (الشهر)، وزر الاستعلام.

احصل على كائن العنصر للعملية وتحقق من إرسال النموذج.

التحقق من السنة بالشكل العادي: /^d{4}/. التحقق من الشهر القاعدة العادية: / ( ( 0 ? [ 1 − 9 ] ) ∣ ( 1 [ 012 ] ) ) /.

يتم التركيز على مربع النص وتتم إزالة لون مربع المطالبة. يفقد مربع النص التركيز، ويزيل المسافة البيضاء على طرفي محتوى الإدخال، ويتم التحقق من صحته.

تنفيذ التعليمات البرمجية

	<!DOCTYPE html>
	<أتش تي أم أل>
	<الرأس>
	<ميتا محارف = "UTF-8">
	<title>الحد من محتوى الإدخال</title>
	<نمط>
	الإدخال [النوع = النص] {العرض: 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;
	</نمط>
	</الرأس>
	<الجسم>
	<معرف النموذج = "النموذج">
	السنة<نوع الإدخال = "نص" اسم = "السنة">
	الشهر <نوع الإدخال = "نص" اسم = "شهر">
	<نوع الإدخال = "إرسال" القيمة = "الاستعلام">
	</النموذج>
	<p id="result"></p>
	<النص البرمجي>
	وظيفة 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'); // كائن العنصر <form> var result = document.getElementById('result'); // <p> كائن العنصر var inputs = document.getElementsByTagName('input'); // <input> مجموعة العناصر form.onsubmit = function() {
	إرجاع checkYear(inputs.year) && checkMonth(inputs.month);
	};
	inputs.year.onfocus = function() {
	this.style.borderColor = '';
	};
	inputs.month.onfocus = function() {
	this.style.borderColor = '';
	};
	إذا (!String.prototype.trim) {
	String.prototype.trim = function() {
	return this.replace(/^[suFEFFxA0]+|[suFEFFxA0]+$/g, '');
	// uFEFF علامة ترتيب البايت xA0 لا تلتف مسافة بيضاء };
	}
	inputs.year.onblur = وظيفة () {
	this.value = this.value.trim();
	checkYear(this);
	};
	inputs.month.onblur = وظيفة () {
	this.value = this.value.trim();
	checkMonth(this);
	};
	</script>
	</الجسم>
	</html>

طريقة اختبار الطريقة () في فئة RegExp

: تكتشف ما إذا كان التعبير العادي يطابق السلسلة المحددة.

عندما تنجح المطابقة، تكون القيمة المرجعة لطريقة الاختبار () صحيحة، وإلا فإنها تُرجع خطأ.

اكتشاف معدّلات النمط للكائنات العادية

توجد أيضًا بعض الخصائص في فئة RegExp التي يتم استخدامها لاكتشاف معدّلات النمط المستخدمة بواسطة الكائن العادي الحالي وتحديد فهرس البداية للمطابقة التالية.

لكي يتمكن القراء من فهم استخدام هذه السمات بشكل أفضل، يستخدم ما يلي مطابقة المسافات كمثال للتوضيح.

طريقة البحث () في فئة السلسلة

: يمكنها إرجاع الموضع الذي تظهر فيه السلسلة الفرعية للنمط المحدد لأول مرة في السلسلة، وهي أقوى من طريقة IndexOf ().

• معلمة طريقة البحث () هي كائن تعبير عادي إذا تم تمرير كائن تعبير غير عادي، فسيتم تحويله ضمنيًا إلى كائن تعبير عادي باستخدام "RegExp الجديد (الذي تم تمريره في المعلمة)".
• القيمة المرجعة لأسلوب البحث () بعد فشل المطابقة هي -1.

طريقة Split () : تستخدم لتقسيم سلسلة إلى مصفوفة سلسلة بناءً على المحدد المحدد. لا تتضمن مصفوفة السلسلة المقسمة المحدد.

عندما يكون هناك أكثر من محدد واحد، يجب تعريف كائن عادي لإكمال عملية تقسيم السلسلة.

• قم بالتقسيم وفقًا للمحددات "@" و"."
• معلمة طريقة الانقسام () هي المحدد الذي تم تعيينه بواسطة وضع التعبير العادي، وقيمة الإرجاع هي نتيجة الانقسام المحفوظة في شكل مصفوفة.

لاحظ أنه

عندما تكون السلسلة فارغة، فإن طريقة التقسيم () تُرجع مصفوفة "[""]" تحتوي على سلسلة فارغة. إذا كانت السلسلة والمحدد سلسلتين فارغتين، فسيتم إرجاع مصفوفة فارغة "[]".

• عند استخدام المطابقة العادية لتقسيم سلسلة، يمكنك أيضًا تحديد عدد تقسيمات السلسلة.
• بعد تحديد عدد تقسيمات السلسلة، إذا كان العدد المحدد أقل من عدد الانقسامات التي تستوفي القواعد في السلسلة الفعلية، فسيتم تجاهل نتائج الانقسام الأخرى في نتيجة الإرجاع النهائية.

العملي

من قوة كلمة المرور

شروط التحقق من قوة كلمة المرور:

① الطول <6 أرقام، لا توجد قوة لكلمة المرور.

②الطول أكبر من 6 أحرف ويحتوي على أحد الأرقام أو الحروف أو الأحرف الأخرى، وقوة كلمة المرور "منخفضة".

③الطول أكبر من 6 أحرف ويحتوي على نوعين من الأرقام أو الحروف أو الأحرف الأخرى. قوة كلمة المرور "متوسطة".

④ إذا كان الطول أكبر من 6 أحرف ويحتوي على ثلاثة أنواع أو أكثر من الأرقام أو الحروف أو الأحرف الأخرى، فإن قوة كلمة المرور هي "عالية".

مؤهل الحرف

مؤهل الحرف - يطرح المؤهل

سؤالاً: يطابق حرفًا متتاليًا، مثل 6 أرقام متتالية "458925".

الحل 1: الكائن العادي/dddddd/gi.

المشاكل: "d" المتكررة ليست سهلة القراءة ومرهقة في الكتابة.

الحل 2: استخدم المؤهلات (?، +، *، { }) لإكمال مطابقة التكرارات المتتالية لشخصية معينة. كائن عادي/d{6}/gi.

مؤهل الحرف - المطابقة الجشعة والكسولة

عند استخدام حرف النقطة (.) مع المؤهل، يمكن أن يطابق أي حرف في نطاق الأرقام المحدد.

• مثال: "^hello.*world$".
• الوصف: يمكنه مطابقة السلاسل التي تبدأ من مرحبًا وتنتهي في العالم، والتي تحتوي على صفر أو أكثر من الأحرف العشوائية بينهما.

يدعم التعبير العادي المطابقة الجشعة والمطابقة البطيئة عند مطابقة أي حرف ضمن نطاق محدد.

• ما يسمى بالجشع يعني مطابقة أكبر عدد ممكن من الأحرف، بينما يعني الكسل مطابقة أقل عدد ممكن من الأحرف. بشكل افتراضي، يتم استخدام المطابقة الجشعة.
• إذا كنت تريد تحقيق المطابقة البطيئة، فأنت بحاجة إلى إضافة الرمز "؟" بعد المؤهل السابق.

أحرف القوس

في التعبيرات العادية، يُطلق على المحتوى المحاط بأحرف القوس "()" اسم "التعبير الفرعي".

تأثير

تنفذ الأقواس مطابقة الالتقاط والتلبية، وإذا لم يتم استخدام الأقواس، تصبح الالتقاط وer.

عندما لا يتم تجميعها، فهذا يعني مطابقة حرفين c؛ بعد التجميع، يعني مطابقة سلسلتين "bc".

الالتقاط والالتقاط غير الالتقاط

: عملية تخزين المحتوى المطابق بتعبير فرعي في منطقة ذاكرة التخزين المؤقت للنظام.

عدم الالتقاط: لا تقم بتخزين المحتوى المطابق للتعبير الفرعي في ذاكرة التخزين المؤقت للنظام، استخدم (؟:x) لتحقيق ذلك.

يمكن لطريقة الاستبدال () لكائن السلسلة استخدام $n مباشرة (n هو عدد صحيح موجب أكبر من 0) للحصول على المحتوى الملتقط وإكمال عملية استبدال المحتوى الذي تم التقاطه بواسطة التعبير الفرعي.

• المعلمة الأولى عبارة عن تعبير عادي يستخدم لمطابقة السلسلة النصية واستبدال المحتوى المتوافق مع القواعد بالمحتوى الذي تحدده المعلمة الثانية.
• يمثل $2 المحتوى "Capture" الذي تم التقاطه بواسطة التعبير الفرعي الثاني في التعبير العادي reg.
• يمثل $1 المحتوى "العادي" الذي تم التقاطه بواسطة التعبير الفرعي الأول.
• القيمة المرجعة هي السلسلة الجديدة بعد الاستبدال، لذلك لن يتم تعديل محتوى السلسلة الأصلية.

يمكنك استخدام "(?:x)" لتحقيق مطابقة غير ملتقطة

المرجع الخلفي

عند كتابة تعبير عادي، إذا كنت ترغب في الحصول على المحتوى الملتقط للتعبير الفرعي المخزن في منطقة ذاكرة التخزين المؤقت في التعبير العادي، فيمكنك استخدام "n" (n هو عدد صحيح موجب أكبر من 0، هذا المرجع). العملية هي "مرجع عكسي".

• يمثل "1" المحتوى الذي تم التقاطه للتعبير الفرعي الأول.
• يمثل "2" المحتوى الملتقط للتعبير الفرعي الثاني، وهكذا.

• يُستخدم "d" لمطابقة أي رقم بين 0 و9.
• بعد إضافة الأقواس "()" إليها، يمكن الحصول على المحتوى الملتقط من خلال المرجع الخلفي.
• ولذلك، فإن نتائج المطابقة النهائية هي 333 و666.

تأكيد العرض صفر

تأكيد العرض الصفري : يشير إلى مطابقة تعبير فرعي صفري العرض، يُستخدم لمعرفة ما إذا كان المحتوى المطابق بالتعبير الفرعي يحتوي على مجموعة أحرف محددة قبل أو بعد.

التصنيف: مقسم إلى جلب مسبق للأمام وجلب مسبق عكسي، ولكن يتم دعم الجلب المسبق للأمام فقط في JavaScript، أي أن مطابقة البيانات قبل أن تحتوي على المحتوى الملتقط أو لا تحتوي عليه، ولا تحتوي نتائج المطابقة على المحتوى الملتقط.

أسبقية عامل التشغيل العادي

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

[الحالة] ​​البحث عن المحتوى واستبداله

فكرة تنفيذ التعليمات البرمجية :

• اكتب HTML وحدد حقلين نصيين، أحدهما لإدخال المستخدم والآخر لعرض المحتوى الذي تمت تصفيته واستبداله كما هو مطلوب.
• طالما أن إدخال المستخدم يحتوي على أحرف سيئة وأي أحرف صينية، فاستخدم * لاستبداله.
• البحث عن قاعدة المحتوى واستبدالها: /(bad)|[u4e00-u9fa5]/gi.

تنفيذ التعليمات البرمجية

	<!DOCTYPE html>
	<أتش تي أم أل>
	<الرأس>
	<ميتا محارف = "UTF-8">
	<title>البحث عن المحتوى واستبداله</title>
	<نمط>
	ع {تعويم: يسار؛}
	الإدخال {الهامش: 0 20 بكسل؛}
	</نمط>
	</الرأس>
	<الجسم>
	<p>المحتوى قبل التصفية:<br>
	<textarea id="pre"rows="10" cols="40"></textarea>
	<معرف الإدخال = "btn" نوع = "زر" القيمة = "تصفية">
	</ص>
	<p>المحتوى الذي تمت تصفيته:<br>
	<textarea id="res"rows="10" cols="40"></textarea>
	</ص>
	<النص البرمجي>
	document.getElementById('btn').onclick = function () {
	// تحديد قواعد المحتوى التي يجب البحث عنها واستبدالها. [u4e00-u9fa5] تعني مطابقة أي أحرف صينية var reg = /(bad)|[u4e00-u9fa5]/gi;
	var str = document.getElementById('pre').value;
	فار newstr = str.replace(reg, '*');
	document.getElementById('res').innerHTML = newstr;
	};
	</script>
	</الجسم>
	</html>

التوصيات ذات الصلة: البرنامج التعليمي لتعلم JavaScript

ما ورد أعلاه هو تعبيرات JavaScript العادية. لمزيد من التفاصيل، يرجى الانتباه إلى المقالات الأخرى ذات الصلة على موقع PHP الصيني!