Skip to content

Patterns and flags #59

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jun 8, 2020
Merged

Patterns and flags #59

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
527cc69
wip patterns and flags
msisaifu May 13, 2020
316b9ca
done patterns and flags
msisaifu May 14, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
138 changes: 69 additions & 69 deletions 9-regular-expressions/01-regexp-introduction/article.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,108 +1,108 @@
# Patterns and flags
# প্যাটার্ন এবং ফ্ল্যাগ

Regular expressions are patterns that provide a powerful way to search and replace in text.
টেক্সটে কোনকিছু খোঁজা অথবা রিপ্লেস করার একটি পাওয়ারফুল মাধ্যম হল রেগুলার এক্সপ্রেশন।

In JavaScript, they are available via the [RegExp](mdn:js/RegExp) object, as well as being integrated in methods of strings.
জাভাস্ক্রিপ্টে এটি [RegExp](mdn:js/RegExp) অবজেক্টের অধীনে আছে এবং স্ট্রিং এর মেথডগুলোর মধ্যে এদের ব্যবহার করতে পারি।

## Regular Expressions
## রেগুলার এক্সপ্রেশনস

A regular expression (also "regexp", or just "reg") consists of a *pattern* and optional *flags*.
রেগুলার এক্সপ্রেশন (যা "regexp" অথবা "reg" নামেও পরিচিত) হল *প্যাটার্ন* এবং অপশনাল *ফ্ল্যাগ* এর মাধ্যমে গঠিত একটি সমন্বিতরূপ।

There are two syntaxes that can be used to create a regular expression object.
দুইভাবে আমরা রেগুলার এক্সপ্রেশন অবজেক্ট তৈরি করতে পারি।

The "long" syntax:
"লং" সিনট্যাক্সঃ

```js
regexp = new RegExp("pattern", "flags");
regexp = new RegExp("প্যাটার্ন", "ফ্ল্যাগ");
```

And the "short" one, using slashes `"/"`:
এবং "শর্ট" সিনট্যাক্স যা `"/"` দ্বারা ডিক্লেয়ার করা হয়ঃ

```js
regexp = /pattern/; // no flags
regexp = /pattern/gmi; // with flags g,m and i (to be covered soon)
regexp = /pattern/; // ফ্ল্যাগ ছাড়া
regexp = /pattern/gmi; // ফ্ল্যাগ সহ g,m and i (এগুলো সম্পর্কে সামনেই জানতে পারব)
```

Slashes `pattern:/.../` tell JavaScript that we are creating a regular expression. They play the same role as quotes for strings.
স্ল্যাস `pattern:/.../` ব্যবহারের মাধ্যমে জাভাস্ক্রিপ্ট ইঞ্জিন বুঝতে পারে এটি একটি রেগুলার এক্সপ্রেশন। যেভাবে `""` অথবা `''` দ্বারা স্ট্রিং কে চিনতে পারে।

In both cases `regexp` becomes an instance of the built-in `RegExp` class.
উভয়ক্ষেত্রে `regexp` বিল্টইন `RegExp` ক্লাস এর ইনস্ট্যান্স হিসেবে তৈরি হয়।

The main difference between these two syntaxes is that pattern using slashes `/.../` does not allow for expressions to be inserted (like string template literals with `${...}`). They are fully static.
এই দুই সিনট্যাক্সের মূল পার্থক্য হল `/.../` এখানে ডাইনামিক্যালি কোন ভেরিয়েবল (যেমনঃ টেমপ্লেট লিটারেলস স্ট্রিং `${...}`) ব্যবহার করতে পারবেন না। এটি পুরোপুরি স্ট্যাটিক।

Slashes are used when we know the regular expression at the code writing time -- and that's the most common situation. While `new RegExp`, is more often used when we need to create a regexp "on the fly" from a dynamically generated string. For instance:
বেশিরভাগ ক্ষেত্রে কোড লিখার সময় যখন আমরা রেগুলার এক্সপ্রেশনটি জানি তখন স্ল্যাস ব্যবহার করি। আর `new RegExp` ব্যবহার করি যখন আমাদের প্যাটার্ন জেনারেট করতে হয় ডাইনামিক্যালি। উদাহরণস্বরুপঃ

```js
let tag = prompt("What tag do you want to find?", "h2");
let tag = prompt("আপনি কোন ট্যাগটি খুঁজতে চাচ্ছেন?", "h2");

let regexp = new RegExp(`<${tag}>`); // same as /<h2>/ if answered "h2" in the prompt above
let regexp = new RegExp(`<${tag}>`); // এটি /<h2>/ এর মত যদি prompt এ ইনপুট h2 দেয়
```

## Flags
## ফ্ল্যাগ

Regular expressions may have flags that affect the search.
রেগুলার এক্সপ্রেশনে কিছু ফ্ল্যাগ আছে যা সার্চিং এর সময় ব্যবহৃত হয়।

There are only 6 of them in JavaScript:
জাভাস্ক্রিপ্টে ৬ ধরনের ফ্ল্যাগ আছেঃ

`pattern:i`
: With this flag the search is case-insensitive: no difference between `A` and `a` (see the example below).
: এই ফ্ল্যাগটি কেস ইনসেনসিটিভ বুঝায়ঃ `A` এবং `a` এর মধ্যে কোন পার্থক্য নেই (নিচের উদাহরণ দেখুন)।

`pattern:g`
: With this flag the search looks for all matches, without it -- only the first match is returned.
: এই ফ্ল্যাগটি টেক্সটে সব মিল খুঁজে, এটি ছাড়া -- শুধু প্রথম মিলটি রিটার্ন করে।

`pattern:m`
: Multiline mode (covered in the chapter <info:regexp-multiline-mode>).
: মাল্টিলাইন মোড (বিস্তারিত এই অধ্যায়ে <info:regexp-multiline-mode>)।

`pattern:s`
: Enables "dotall" mode, that allows a dot `pattern:.` to match newline character `\n` (covered in the chapter <info:regexp-character-classes>).
: "dotall" মোড, নিউলাইন ক্যারেক্টার `\n` কে ডট `pattern:.` দিয়ে খোঁজা যায় (বিস্তারিত এই অধ্যায়ে <info:regexp-character-classes>).

`pattern:u`
: Enables full unicode support. The flag enables correct processing of surrogate pairs. More about that in the chapter <info:regexp-unicode>.
: ফুল ইউনিকোর্ড সাপোর্ট এনাবল করে। ফ্ল্যাগটি সঠিকভাবে সারোগেটজোড় কে প্রসেসিংয়ের সাপোর্ট দেয়। আরো জানতে পারবেন এই অধ্যায়ে <info:regexp-unicode>।

`pattern:y`
: "Sticky" mode: searching at the exact position in the text (covered in the chapter <info:regexp-sticky>)
: "Sticky" মোডঃ সার্চিং এর সময় টেক্সটে এক্স্যাক্ট পজিশনটি জানা যায় (বিস্তারিত এই অধ্যায়ে <info:regexp-sticky>)

```smart header="Colors"
From here on the color scheme is:
```smart header="কালারস"
এখানে কালার স্কিমটা হলঃ

- regexp -- `pattern:red`
- string (where we search) -- `subject:blue`
- string (যেখানে আমরা সার্চ করি) -- `subject:blue`
- result -- `match:green`
```

## Searching: str.match
## সার্চিংঃ str.match

As mentioned previously, regular expressions are integrated with string methods.
আমরা পূর্বেই জেনেছি, রেগুলার এক্সপ্রেশনগুলো স্ট্রিংয়ের মেথডগুলোর সাথে ইন্টিগ্রেটেড।

The method `str.match(regexp)` finds all matches of `regexp` in the string `str`.
`str.match(regexp)` মেথডটির সাহায্যে `str` এর মধ্যে `regexp` এর সকল মিল খুঁজা যায়।

It has 3 working modes:
এটির ৩ ধরণের মোড আছেঃ

1. If the regular expression has flag `pattern:g`, it returns an array of all matches:
1. যদি রেগুলার এক্সপ্রেশনে `pattern:g` এই ফ্ল্যাগটি ব্যবহৃত হয়, এটি সব মিলপ্রাপ্ত প্যাটার্নগুলোকে অ্যারেতে রিটার্ন করেঃ
```js run
let str = "We will, we will rock you";

alert( str.match(/we/gi) ); // We,we (an array of 2 substrings that match)
alert( str.match(/we/gi) ); // We,we (অ্যারে আকারে এই ২টি সাবস্ট্রিং রিটার্ন করবে)
```
Please note that both `match:We` and `match:we` are found, because flag `pattern:i` makes the regular expression case-insensitive.
লক্ষ্য করুন এখানে `match:We` এবং `match:we` দুটিই দেখাবে, যেহেতু আমরা কেস-ইনসেনসিটিভ ফ্ল্যাগটি ব্যবহার করেছি।

2. If there's no such flag it returns only the first match in the form of an array, with the full match at index `0` and some additional details in properties:
2. যদি আমরা কোন ফ্ল্যাগ ব্যবহার না করি তাহলে এটি প্রথম মিলটিকে অ্যারে আকারে রিটার্ন করবে, সম্পূর্ন মিলটিকে আমরা ইনডেক্স `0` তে পাই এবং প্রপার্টিগুলোর অতিরিক্ত কিছু বর্ননাঃ
```js run
let str = "We will, we will rock you";

let result = str.match(/we/i); // without flag g
let result = str.match(/we/i); // ফ্ল্যাগ g ছাড়া

alert( result[0] ); // We (1st match)
alert( result[0] ); // We (১ম মিল)
alert( result.length ); // 1

// Details:
alert( result.index ); // 0 (position of the match)
alert( result.index ); // 0 (প্রাপ্ত মিলের পজিশন)
alert( result.input ); // We will, we will rock you (source string)
```
The array may have other indexes, besides `0` if a part of the regular expression is enclosed in parentheses. We'll cover that in the chapter <info:regexp-groups>.
`0` এর পাশাপাশি অ্যারের অন্যান্য ইনডেক্সও থাকতে পারে যদি এক্সপ্রেশনটিতে প্রথম বন্ধনী থাকে। আমরা এই অধ্যায়ে এসম্পর্কে বিস্তারিত জানতে পারব <info:regexp-groups>।

3. And, finally, if there are no matches, `null` is returned (doesn't matter if there's flag `pattern:g` or not).
3. এবং, সর্বশেষে যদি কোন মিল খুঁজে পাওয়া না যায় `null` রিটার্ন করবে (এটি `pattern:g` ফ্ল্যাগের উপর নির্ভর করে না)।

This a very important nuance. If there are no matches, we don't receive an empty array, but instead receive `null`. Forgetting about that may lead to errors, e.g.:
একটি গুরুত্বপূর্ন ব্যাপার খেয়াল রাখা উচিত। কোন মিল খুঁজে পাওয়া না গেলে এম্পটি স্ট্রিং এর বদলে `null` রিটার্ন করে। এজন্য এম্পটি চেকিংয়ের জন্য ভুলভাবে চেকিংয়ের জন্য এরর পেতে পারেন, যেমনঃ

```js run
let matches = "JavaScript".match(/HTML/); // = null
Expand All @@ -112,50 +112,50 @@ It has 3 working modes:
}
```

If we'd like the result to always be an array, we can write it this way:
নিম্নোক্ত উপায়ে রেজাল্ট আমরা সর্বদা অ্যারে হিসেবে চেক করতে পারিঃ

```js run
let matches = "JavaScript".match(/HTML/)*!* || []*/!*;

if (!matches.length) {
alert("No matches"); // now it works
alert("No matches"); // এখন এটি কাজ করবে
}
```

## Replacing: str.replace
## রিপ্লেসিংঃ str.replace

The method `str.replace(regexp, replacement)` replaces matches found using `regexp` in string `str` with `replacement` (all matches if there's flag `pattern:g`, otherwise, only the first one).
`str.replace(regexp, replacement)` মেথডটি `regexp` দ্বারা প্রাপ্ত সব মিলকে `replacement` করে `pattern:g` ফ্ল্যাগের জন্য, অন্যথায় শুধু প্রথম মিলটিকে রিপ্লেস করে।

For instance:
উদাহরণস্বরূপঃ

```js run
// no flag g
// g ফ্ল্যাগ ছাড়া
alert( "We will, we will".replace(/we/i, "I") ); // I will, we will

// with flag g
// g ফ্ল্যাগ সহ
alert( "We will, we will".replace(/we/ig, "I") ); // I will, I will
```

The second argument is the `replacement` string. We can use special character combinations in it to insert fragments of the match:
দ্বিতীয় আর্গুমেন্টে `replacement` স্ট্রিংটি পাস করা হয়। মিল খুঁজে পাওয়া অংশগুলো `replacement` এর সাথে ব্যবহার করতে আমরা কিছু স্পেশাল ক্যারেক্টার সংযুক্ত করতে পারি।

| Symbols | Action in the replacement string |
| সিম্বলস | রিপ্লসমেন্ট স্ট্রিংয়ে সংগঠিত অ্যাকশন |
|--------|--------|
|`$&`|inserts the whole match|
|<code>$&#096;</code>|inserts a part of the string before the match|
|`$'`|inserts a part of the string after the match|
|`$n`|if `n` is a 1-2 digit number, then it inserts the contents of n-th parentheses, more about it in the chapter <info:regexp-groups>|
|`$<name>`|inserts the contents of the parentheses with the given `name`, more about it in the chapter <info:regexp-groups>|
|`$$`|inserts character `$` |
|`$&`|পুরো মিলটিকে সংযুক্ত করে|
|<code>$&#096;</code>|মিলের আগ পর্যন্ত স্ট্রিংকেও সংযুক্ত করে|
|`$'`|মিলের পরের স্ট্রিংকেও সংযুক্ত করে|
|`$n`|যদি `n` ১-২ ডিজিটের নাম্বার হয়, আমরা বন্ধনী দ্বারা পাওয়া মানগুলোকে `$n` সংযুক্ত করতে পারি, বিস্তারিত এই অধ্যায়ে <info:regexp-groups>|
|`$<name>`|আমরা বন্ধনী দ্বারা পাওয়া মানগুলোকে `name` সংযুক্ত করতে পারি,বিস্তারিত এই অধ্যায়ে <info:regexp-groups>|
|`$$`|`$` ক্যারাক্টারটি সংযুক্ত করতে|

An example with `pattern:$&`:
`pattern:$&` এর একটি উদাহরণঃ

```js run
alert( "I love HTML".replace(/HTML/, "$& and JavaScript") ); // I love HTML and JavaScript
```

## Testing: regexp.test
## টেস্টিংঃ regexp.test

The method `regexp.test(str)` looks for at least one match, if found, returns `true`, otherwise `false`.
`regexp.test(str)` মেথডটি অন্তত একটি মিল খুঁজে পেলে `true` রিটার্ন করে, অন্যথায় `false` রিটার্ন করে।

```js run
let str = "I love JavaScript";
Expand All @@ -164,14 +164,14 @@ let regexp = /LOVE/i;
alert( regexp.test(str) ); // true
```

Later in this chapter we'll study more regular expressions, walk through more examples, and also meet other methods.
পরবর্তী অধ্যায়গুলোতে রেগুলার এক্সপ্রেশন সম্পর্কে আমরা আরো অনেক কিছু শিখব, আরো অনেক উদাহরণ এবং রেগুলার এক্সপ্রেশনের অন্যান্য মেথডগুলোও জানব।

Full information about the methods is given in the article <info:regexp-methods>.
মেথডগুলো সম্পর্কে বিস্তারিত আমরা এই অধ্যায়ে জানব <info:regexp-methods>.

## Summary
## সারাংশ

- A regular expression consists of a pattern and optional flags: `pattern:g`, `pattern:i`, `pattern:m`, `pattern:u`, `pattern:s`, `pattern:y`.
- Without flags and special symbols (that we'll study later), the search by a regexp is the same as a substring search.
- The method `str.match(regexp)` looks for matches: all of them if there's `pattern:g` flag, otherwise, only the first one.
- The method `str.replace(regexp, replacement)` replaces matches found using `regexp` with `replacement`: all of them if there's `pattern:g` flag, otherwise only the first one.
- The method `regexp.test(str)` returns `true` if there's at least one match, otherwise, it returns `false`.
- রেগুলার এক্সপ্রেশন গঠিত হয় প্যাটার্ন এবং অপশনাল ফ্ল্যাগের সমন্বয়েঃ `pattern:g`, `pattern:i`, `pattern:m`, `pattern:u`, `pattern:s`, `pattern:y`।
- ফ্ল্যাগ এবং স্পেশাল সিম্বল ছাড়া (পরবর্তীতে জানব) regexp এর সার্চ substring সার্চ এর মত কাজ করে.
- `str.match(regexp)` মেথডটি `pattern:g` ফ্ল্যাগের জন্য প্যাটার্নের সাথে সকল মিল খুঁজে, অন্যথায় শুধু প্রথম মিলটি খুঁজে।
- `str.replace(regexp, replacement)` মেথডটি `regexp` দ্বারা প্রাপ্ত সব মিলকে `replacement` করে `pattern:g` ফ্ল্যাগের জন্য, অন্যথায় শুধু প্রথম মিলটিকে রিপ্লেস করে।
- `regexp.test(str)` মেথডটি অন্তত একটি মিল খুঁজে পেলে `true` রিটার্ন করে, অন্যথায় `false` রিটার্ন করে।