Фронтендщик
Відкрити в Telegram
Все для frontend developer, шуточки, тесты, статьи Администрация/Реклама @vtopua
Показати більше1 106
Підписники
Немає даних24 години
-17 днів
-1030 день
Триває завантаження даних...
Схожі канали
![Frontender's notes [ru]](https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.telemetr.io%2Fc%2F1qrVZ3%2F5348049928330532677%3Fty%3Dx&w=256&q=75)
Хмара тегів
Вхідні та вихідні згадування
---
---
---
---
---
---
Залучення підписників
липень '26
липень '260
в 0 каналах
червень '260
в 1 каналах
Get PRO
травень '260
в 0 каналах
Get PRO
квітень '260
в 1 каналах
Get PRO
березень '26
+1
в 0 каналах
Get PRO
лютий '26
+1
в 0 каналах
Get PRO
січень '260
в 0 каналах
Get PRO
грудень '25
+1
в 0 каналах
Get PRO
листопад '25
+1
в 0 каналах
Get PRO
жовтень '250
в 0 каналах
Get PRO
вересень '25
+7
в 0 каналах
Get PRO
серпень '25
+1
в 0 каналах
Get PRO
липень '25
+2
в 0 каналах
Get PRO
червень '25
+1
в 0 каналах
Get PRO
травень '250
в 0 каналах
Get PRO
квітень '25
+1
в 0 каналах
Get PRO
березень '25
+6
в 0 каналах
Get PRO
лютий '25
+4
в 0 каналах
Get PRO
січень '25
+2
в 0 каналах
Get PRO
грудень '240
в 1 каналах
Get PRO
листопад '24
+1
в 0 каналах
Get PRO
жовтень '24
+1
в 0 каналах
Get PRO
вересень '24
+2
в 0 каналах
Get PRO
серпень '24
+2
в 0 каналах
Get PRO
липень '24
+3
в 0 каналах
Get PRO
червень '24
+3
в 0 каналах
Get PRO
травень '24
+4
в 0 каналах
Get PRO
квітень '24
+3
в 0 каналах
Get PRO
березень '24
+3
в 0 каналах
Get PRO
лютий '24
+3
в 1 каналах
Get PRO
січень '24
+2
в 0 каналах
Get PRO
грудень '23
+3
в 0 каналах
Get PRO
листопад '23
+4
в 0 каналах
Get PRO
жовтень '23
+3
в 0 каналах
Get PRO
вересень '23
+8
в 0 каналах
Get PRO
серпень '23
+4
в 0 каналах
Get PRO
липень '23
+14
в 0 каналах
Get PRO
червень '23
+6
в 0 каналах
Get PRO
травень '23
+8
в 0 каналах
Get PRO
квітень '23
+41
в 0 каналах
Get PRO
березень '23
+6
в 0 каналах
Get PRO
лютий '23
+9
в 0 каналах
Get PRO
січень '23
+17
в 0 каналах
Get PRO
грудень '22
+177
в 0 каналах
Get PRO
листопад '22
+142
в 0 каналах
Get PRO
жовтень '22
+26
в 0 каналах
Get PRO
вересень '22
+328
в 0 каналах
Get PRO
серпень '22
+1 290
в 0 каналах
Get PRO
липень '22
+106
в 0 каналах
Get PRO
червень '22
+2
в 0 каналах
Get PRO
травень '220
в 0 каналах
Get PRO
квітень '220
в 0 каналах
Get PRO
березень '220
в 0 каналах
Get PRO
лютий '220
в 0 каналах
Get PRO
січень '220
в 0 каналах
Get PRO
грудень '210
в 0 каналах
Get PRO
листопад '21
+1
в 0 каналах
Get PRO
жовтень '21
+1
в 0 каналах
Get PRO
вересень '21
+4
в 0 каналах
Get PRO
серпень '210
в 0 каналах
Get PRO
липень '210
в 0 каналах
Get PRO
червень '21
+1
в 0 каналах
Get PRO
травень '210
в 0 каналах
Get PRO
квітень '21
+3
в 0 каналах
Get PRO
березень '21
+2
в 0 каналах
Get PRO
лютий '210
в 0 каналах
Get PRO
січень '21
+1
в 0 каналах
Get PRO
грудень '20
+1 226
в 0 каналах
| Дата | Залучення підписників | Згадування | Канали | |
| 13 липня | 0 | |||
| 12 липня | 0 | |||
| 11 липня | 0 | |||
| 10 липня | 0 | |||
| 09 липня | 0 | |||
| 08 липня | 0 | |||
| 07 липня | 0 | |||
| 06 липня | 0 | |||
| 05 липня | 0 | |||
| 04 липня | 0 | |||
| 03 липня | 0 | |||
| 02 липня | 0 | |||
| 01 липня | 0 |
Дописи каналу
Начало и конец строки в регулярках JavaScript
Существуют специальные символы, которые обозначают начало '^' или конец строки '$'. Давайте посмотрим их работу на примерах.
Пример
В данном примере шаблон поиска такой: заменить 'aaa' на '!' только, если оно стоит в начале строки:
let str = 'aaa aaa aaa';
let res = str.replace(/^aaa/g,
'!');
В результате в переменную запишется следующее:
'! aaa aaa'
📌 #instr || Фронтендщик
| 2 | Пример
А теперь добавим модификатор i и регулярка начнет искать
символы во всех регистрах:
let str = 'aaa AAA bbb BBB';
let res = str.replace(/[a-z]+/ig,
'!');
В результате в переменную запишется следующее:
'! ! ! !'
📌 #instr || Фронтендщик | 12 |
| 3 | Игнорирование регистра в регулярках JavaScript
С помощью модификатора i можно игнорировать регистр символов. Давайте посмотрим, как это делается.
Пример
В следующем примере регулярка найдет только маленькие буквы:
let str = 'aaa bbb CCC DDD';
let res = str.replace(/[a-z]+/g,
'!');
В результате в переменную запишется следующее:
'! ! CCC DDD'
📌 #instr || Фронтендщик | 16 |
| 4 |  Пример
Можно расположить дефис между двумя группами - там он точно еще не сделает еще одну группу:
let str = 'axx 9xx -xx @xx';
let res = str.replace(/[a-z-0-9]xx/g,
'!');
В результате в переменную запишется следующее:
'! ! ! @xx'
📌 #instr || Фронтендщик | 19 |
| 5 | Пример
В следующем примере шаблон поиска такой: первый символ - это маленькие, большие буквы или дефис '-', потом две буквы 'x':
let str = 'axx Axx -xx @xx';
let res = str.replace(/[a-zA-Z-]xx/g,
'!');
В результате в переменную запишется следующее:
'! ! ! @xx'
📌 #instr || Фронтендщик | 19 |
| 6 | Пример
В следующем примере шаблон поиска такой: первый символ - это маленькие буквы или дефис '-', потом две буквы 'x':
let str = 'axx Axx -xx @xx';
let res = str.replace(/[a-z-]xx/g,
'!');
В результате в переменную запишется следующее:
'! Axx ! @xx'
📌 #instr || Фронтендщик | 21 |
| 7 | ![Пример Можно просто переставить дефис, не экранируя его: let str = '1a2 1-2 1c2 1z2'; let res = str.replace(/1[az-]2/g, '!');](https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fn3.tlmtr.cc%2Fp%2F_hQmF-wcrWcnQE4yTrluBPxmNReCzcYDfcTjp7RaYqG0%3Fty%3Dx&w=64&q=75){kind=small} Пример
Можно просто переставить дефис, не экранируя его:
let str = '1a2 1-2 1c2 1z2';
let res = str.replace(/1[az-]2/g,
'!');
В результате в переменную запишется следующее:
'! ! 1c2 !'
📌 #instr || Фронтендщик | 21 |
| 8 | Пример
Давайте теперь заэкранируем дефис. В результате шаблон поиска такой: цифра 1, затем буква 'a', или дефис, или буква 'z', затем цифра 2:
let str = '1a2 1-2 1c2 1z2';
let res = str.replace(/1[a\-z]2/g,
'!');
В результате в переменную запишется следующее:
'! ! 1c2 !'
📌 #instr || Фронтендщик | 24 |
| 9 | Пример
В следующем примере шаблон поиска такой: цифра 1, затем буква от 'a' до 'z', затем цифра 2:
let str = '1a2 1-2 1c2 1z2';
let res = str.replace(/1[a-z]2/g,
'!');
В результате в переменную запишется следующее:
'! 1-2 ! !'
📌 #instr || Фронтендщик | 22 |
| 10 | Можно также заэкранировать дефис - тогда он будет обозначать сам себя независимо от позиции. Например, вместо [:-@]написать [:\-@] - и группы уже не будет, а будут три символа - двоеточие, дефис и собака @.
📌 #instr || Фронтендщик | 24 |
| 11 | Откуда они взялись? Из таблицы ASCII - двоеточие имеет номер меньше, чем собака - и получается группа. To есть все группы получаются по таблице ASCII (при желании этим можно пользоваться).
Как с этим бороться: поставьте символ дефиса там, где он точно не будет воспринят как символ группы, например, в начале или в конце (то есть после [или перед ]).
📌 #instr || Фронтендщик | 24 |
| 12 | ![Дефис внутри наборов в регулярках JavaScript Дефис - тоже спецсимвол внутри [ ] (а вот снаружи - нет). Если вам нужен сам деф](data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAXACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwB6KCg4GffNBUL2B/Omh8ADBOPegyZXHP51qABd7cDFKQA33W2r1qPnqOCORU+FIbLAkn1qZPl1GtXYiYDGVOR70VJcEeZtBBAopx1VwsRcY96KKKYCjGeelMKBjkn9OmKKKTQDiF6j8aKKKYH/2Q==){kind=small} Дефис внутри наборов в регулярках JavaScript
Дефис - тоже спецсимвол внутри [ ] (а вот снаружи - нет). Если вам нужен сам дефис как символ - то поставьте его там, где он не будет воспринят как разделитель группы.
Почему это важно: вы можете сделать группу символов, сами не заметив этого. К примеру, вот так - '[:-@]' - вы думаете, что выбираете двоеточие, дефис и собаку, а на самом деле получается группа символов между : и @. В эту группу входят следующие символы: ? < = > : ;
📌 #instr || Фронтендщик | 23 |
| 13 |  Пример
Можно не убирать шляпку с первого места, а просто заэкранировать ее с помощью обратного слеша, и она станет обозначать саму себя:
let str = 'axx bxx ^xx dxx';
let res = str.replace(/[\^d]xx/g,
'!');
В результате в переменную запишется следующее:
'axx bxx ! !'
📌 #instr || Фронтендщик | 21 |
| 14 | Пример
А теперь шаблон поиска такой: первый символ - это 'd' или '^', потом две буквы 'x':
let str = 'axx bxx ^xx dxx';
let res = str.replace(/[d^]xx/g,
'!');
В результате в переменную запишется следующее:
'axx bxx ! !'
📌 #instr || Фронтендщик | 21 |
| 15 | Пример
В следующем примере шаблон поиска такой: первый символ - это все кроме 'd', потом две буквы 'x'.
let str = 'axx bxx ^xx dxx';
let res = str.replace(/[^d]xx/g,
'!');
В результате в переменную запишется следующее:
'! ! ! dxx'
📌 #instr || Фронтендщик | 24 |
| 16 | Символ шляпки внутри наборов в регулярках JavaScript
Как вы знаете, шляпка внутри [ ] делает отрицание, будучи написанной в начале скобок. Значит, она является спецсимволом внутри этих скобок. Чтобы получить шляпку как символ, нужно или заэкранировать ее, или убрать с первого места.
📌 #instr || Фронтендщик | 26 |
| 17 | ![Для примера в следующем коде шаблон поиска выглядит так: между иксами стоит квадратная скобка: let str = 'x]x xax x[x x1x'; l](data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACgcHiMeGSgjISMtKygwPGRBPDc3PHtYXUlkkYCZlo+AjIqgtObDoKrarYqMyP/L2u71////m8H////6/+b9//j/2wBDASstLTw1PHZBQXb4pYyl+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj4+Pj/wAARCAAXACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwByqCo4H607YPRf1piybQBg/nSmQ44yPxrUBBHlgAQfpSkAN91tq9ajJPUHBHIqfCkNlgST61Mny6jWrsRMBjKnI96KkuCPM2gggUU46q4WIuMe9FFFMBRjPPSmFAxyT+nTFFFJoBxC9R+NFFFMD//Z){kind=small} Для примера в следующем коде шаблон поиска выглядит так: между иксами стоит квадратная скобка:
let str = 'x]x xax x[x x1x';
let res = str.replace(/x[\[\]]x/g,
'!');
В результате в переменную запишется следующее:
'! xax ! x1x'
📌 #instr || Фронтендщик | 29 |
| 18 | Исключения внутри наборов в регулярках JavaScript
Вы уже знаете, что спецсимволы внутри [] становятся обычными символами. Есть, однако, исключения: если вам нужны квадратные скобки как символы внутри [ ] - то их нужно экранировать обратным слешем.
📌 #instr || Фронтендщик | 30 |
| 19 |  Пример
В данном примере шаблон поиска выглядит так: буква 'x', затем не цифра, не точка, и не маленькая латинская буква, затем буква 'z':
let str = 'xaz x1z xAz x.z x@z';
let res = str.replace(/x[^\d.a-z]z/g,
'!');
В результате в переменную запишется следующее:
'xaz x1z ! x.z !'
📌 #instr || Фронтендщик | 29 |
| 20 | Группы символов внутри наборов в регулярках JavaScript
Группы символов \d, \D, \w, \W, \s, \Sвнутри [] будут обозначать именно группы, то есть по-прежнему будут командами.
Пример
В данном примере шаблон поиска выглядит так: между иксами любая цифра, либо буква от 'a' до 'f':
let str = 'xax xbx x1x
x2x xhx x@x';
let res = str.replace(/x[\da-f]x/g,
'!');
В результате в переменную запишется следующее:
'! ! ! ! xhx x@x'
📌 #instr || Фронтендщик | 21 |
