٢٥ مارس ٢٠٢١

التناوب (أو) |

البديل هو المصطلح في التعبير العادي وهو في الواقع “OR” بسيط.

في التعبير العادي ، يُشار إليه بحرف السطر العمودي |.

على سبيل المثال ، نحتاج إلى العثور على لغات البرمجة: HTML أو PHP أو Java أو JavaScript.

التعبير العادي المقابل: html | php | java (script)؟.

مثال للاستخدام:

let regexp = /html|php|css|java(script)?/gi;

let str = 'First HTML appeared, then CSS, then JavaScript';

alert(str.match(regexp)); // 'HTML', 'CSS', 'JavaScript'

لقد رأينا بالفعل شيئًا مشابهًا – الأقواس المربعة. تسمح بالاختيار بين عدة أحرف ، على سبيل المثال gr [ae] y يطابق gre أو grey.

Square brackets allow only characters or character classes. Alternation allows any expressions. A regexp A|B|C means one of expressions A, B or C.

على سبيل المثال:

  • gr (a | e) y يعني تمامًا مثل gr [ae] y.
  • gra | ey تعني gra أو ey.

لتطبيق التناوب على جزء مختار من النمط ، يمكننا تضمينه بين قوسين:

  • النمط: أحب HTML | CSS يطابقمطابقة: أنا أحب HTML أو تطابق: CSS.
  • I love (HTML | CSS) يتطابق مع I love HTML أو I love CSS.

مثال: regexp للوقت

In previous articles there was a task to build a regexp for searching time in the form hh:mm, for instance 12:00. But a simple \d\d:\d\d is too vague. It accepts 25:99 as the time (as 99 minutes match the pattern, but that time is invalid).

كيف يمكننا صنع نمط أفضل؟

يمكننا استخدام مطابقة أكثر دقة. اولا الساعات:

  • إذا كان الرقم الأول هو “0” أو “1” ، فيمكن أن يكون الرقم التالي أي: [01] \ d.
  • وإلا ، إذا كان الرقم الأول هو “2” ، فيجب أن يكون الرقم التالي "pattern: [0-3]`.
  • (غير مسموح بالرقم الأول الآخر)

يمكننا كتابة كلا المتغيرين في regexp باستخدام البديل: [01] \ d | 2 [0-3].

بعد ذلك ، يجب أن تكون الدقائق من 00 إلى59. في لغة التعبير العادي التي يمكن كتابتها كـ [0-5] \ d: الرقم الأول0-5 ، ثم أي رقم.

If we glue hours and minutes together, we get the pattern: [01]\d|2[0-3]:[0-5]\d.

لقد انتهينا تقريبًا ، ولكن هناك مشكلة. يحدث “النمط البديل”: | الآن بين النمط: [01] \ dو "النمط: 2 [0-3]: [0-5] \ d.

أي: تمت إضافة الدقائق إلى البديل الثاني ، إليك صورة واضحة:

[01] \ d | 2 [0-3]: [0-5] \ د

يبحث هذا النمط عن النمط: [01] \ d أوالنمط: 2 [0-3]: [0-5] \ d.

ولكن هذا خطأ ، يجب استخدام التناوب فقط في جزء “الساعات” من التعبير العادي ، للسماح بـ "pattern: [01] \ dOR pattern: 2 [0-3] . دعنا نصحح ذلك عن طريق وضع "ساعات" بين قوسين:النمط: ([01] \ d | 2 [0-3]): [0-5] \ d`.

الحل النهائي:

let regexp = /([01]\d|2[0-3]):[0-5]\d/g;

alert('00:00 10:10 23:59 25:99 1:2'.match(regexp)); // 00:00,10:10,23:59

مهمه

هناك العديد من لغات البرمجة ، مثل Java و JavaScript و PHP و C و C ++.

أنشئ التعبير العادي الذي يعثر عليه في السلسلة الموضوع: Java JavaScript PHP C ++ C:

let regexp = /your regexp/g;

alert("Java JavaScript PHP C++ C".match(regexp)); // Java JavaScript PHP C++ C

يمكن أن تكون الفكرة الأولى هي سرد اللغات التي يوجد بها “|” في الوسط.

لكن هذا لا يعمل بشكل صحيح:

let regexp = /Java|JavaScript|PHP|C|C\+\+/g;

let str = "Java, JavaScript, PHP, C, C++";

alert( str.match(regexp) ); // Java,Java,PHP,C,C

يبحث محرك التعبير العادي عن البدائل واحدة تلو الأخرى. هذا هو: أولاً يتحقق مما إذا كان لدينا Java ، وإلا – يبحث عن JavaScript وما إلى ذلك.

ونتيجة لذلك ، لا يمكن العثور على JavaScript مطلقًا ، فقط لأنه يتم تحديد Java أولاً.

نفس الشيء مع C و C ++.

هناك حلان لهذه المشكلة:

  1. قم بتغيير الترتيب للتحقق من المطابقة الأطول أولاً: JavaScript | Java | C \ + \ + | C | PHP.
  2. دمج المتغيرات بنفس البداية: Java (Script)؟ | C (\ + \ +)؟ | PHP.

بشكل عملي:

let regexp = /Java(Script)?|C(\+\+)?|PHP/g;

let str = "Java, JavaScript, PHP, C, C++";

alert( str.match(regexp) ); // Java,JavaScript,PHP,C,C++

تبدو علامة “bb-tag” مثل [tag] ... [/ tag] ، حيث tag هي واحدة من:b أو url أوquote.

على سبيل المثال:

[b]text[/b]
[url]http://google.com[/url]

يمكن أن تتداخل علامات BB. ولكن لا يمكن إدراج علامة في نفسها ، على سبيل المثال:

بشكل طبيعي:
[url] [b]http://google.com[/b] [/url]
[quote] [b]text[/b] [/quote]

لا يمكن حدوثه:
[b][b]text[/b][/b]

يمكن أن تحتوي العلامات على فواصل أسطر ، وهذا أمر طبيعي:

[quote]
  [b]text[/b]
[/quote]

قم بإنشاء التعبير العادي للعثور على جميع علامات BB مع محتوياتها. على سبيل المثال:

let regexp = /your regexp/flags;

let str = "..[url]http://google.com[/url]..";
alert( str.match(regexp) ); // [url]http://google.com[/url]

إذا كانت العلامات متداخلة ، فإننا نحتاج إلى العلامة الخارجية (إذا أردنا ، يمكننا متابعة البحث في محتواها):

let regexp = /your regexp/flags;

let str = "..[url][b]http://google.com[/b][/url]..";
alert( str.match(regexp) ); // [url][b]http://google.com[/b][/url]

علامة الفتح هي النمط: \ [(b | url | الاقتباس) \].

ثم للعثور على كل شيء حتى علامة الإغلاق – دعنا نستخدم النمط . *؟ مع العلامة s لمطابقة أي حرف بما في ذلك السطر الجديد ثم إضافة مرجع خلفي إلى علامة الإغلاق.

النمط الكامل: \ [(b | url | الاقتباس) \]. *؟ \ [/ \ 1 \].

بشكل عملي:

let regexp = /\[(b|url|quote)\].*?\[\/\1\]/gs;

let str = `
  [b]hello![/b]
  [quote]
    [url]http://google.com[/url]
  [/quote]
`;

alert( str.match(regexp) ); // [b]hello![/b],[quote][url]http://google.com[/url][/quote]

يرجى ملاحظة أنه بالإضافة إلى الهروب من نمط: [ و نقش:] ، كان علينا أن نهرب من شرطة مائلة لنموذج علامة الإغلاق: [\ / \ 1] `، لأن الخط المائل يغلق النمط عادةً.

قم بإنشاء regexp للعثور على سلاسل في علامات اقتباس مزدوجة الموضوع:" ... ".

يجب أن تدعم السلاسل الهروب ، بنفس الطريقة التي تدعمها سلاسل JavaScript. على سبيل المثال ، يمكن إدراج علامات الاقتباس كـ \"سطر جديد مثل \ n ، والشرطة نفسها كـ \\.

let str = "Just like \"here\".";

يرجى ملاحظة ، على وجه الخصوص ، أن الاقتباس الهارب موضوع: \"لا ينهي سلسلة.

لذلك يجب علينا البحث من اقتباس واحد إلى الآخر تجاهل علامات الاقتباس الهاربة على الطريق.

هذا هو الجزء الأساسي من المهمة ، وإلا سيكون تافها.

أمثلة على السلاسل المراد مطابقتها:

.. "test me" ..
.. "Say \"Hello\"!" ... (escaped quotes inside)
.. "\\" ..  (double slash inside)
.. "\\ \"" ..  (double slash and an escaped quote inside)

في جافا سكريبت ، نحتاج إلى مضاعفة الخطوط المائلة لتمريرها مباشرة في السلسلة ، مثل هذا:

let str = ' .. "test me" .. "Say \\"Hello\\"!" .. "\\\\ \\"" .. ';

// the in-memory string
alert(str); //  .. "test me" .. "Say \"Hello\"!" .. "\\ \"" ..

الحل: /" (\\. | [^ "\\]) *" / g.

خطوة بخطوة:

  • First we look for an opening quote "
  • Then if we have a backslash \\ (we have to double it in the pattern because it is a special character), then any character is fine after it (a dot).
  • Otherwise we take any character except a quote (that would mean the end of the string) and a backslash (to prevent lonely backslashes, the backslash is only used with some other symbol after it): [^"\\]
  • …And so on till the closing quote.

بشكل:

let regexp = /"(\\.|[^"\\])*"/g;
let str = ' .. "test me" .. "Say \\"Hello\\"!" .. "\\\\ \\"" .. ';

alert(str.match(regexp)); // "test me","Say \"Hello\"!","\\ \""

اكتب regexp للعثور على العلامة <style ...>. يجب أن تتطابق مع العلامة الكاملة: قد لا تحتوي على سمات <style> أو تحتوي على العديد منها <style type =" ... "id =" ... ">.

… لكن التعبير العادي يجب ألا يطابق <styler>!

على سبيل المثال:

let regexp = /your regexp/g;

alert( '<style> <styler> <style test="...">'.match(regexp) ); // <style>, <style test="...">

بداية النمط واضحة: <style.

… ولكن بعد ذلك لا يمكننا ببساطة كتابة <style. *؟> ، لأن <styler> ستطابقها.

نحتاج إلى مسافة بعد <style ثم اختياريًا شيء آخر أوmatch:>` النهائي.

في لغة regexp: <style (> | \ s. *؟>).

بشكل عملي:

let regexp = /<style(>|\s.*?>)/g;

alert( '<style> <styler> <style test="...">'.match(regexp) ); // <style>, <style test="...">
خريطة الدورة التعليمية

التعليقات

إقرأ هذا قبل أن تضع تعليقًا…
  • إذا كان لديك اقتراحات أو تريد تحسينًا - من فضلك من فضلك إفتح موضوعًا فى جيتهاب أو شارك بنفسك بدلًا من التعليقات.
  • إذا لم تستطع أن تفهم شيئّا فى المقال - وضّح ماهو.
  • إذا كنت تريد عرض كود استخدم عنصر <code> ، وللكثير من السطور استخدم <pre>، ولأكثر من 10 سطور استخدم (plnkr, JSBin, codepen…)