Фронтендщик

Например, у нас есть программа, которая должна спросить email пользователя. Если пользователь ввел email в некорректном формате - это не сбой. Это ожидаемая проблема и наша программа будет спрашивать у пользователя email столько раз, пока он не введет его корректно. Пусть наша программа, которая спрашивает email, должна также отправить этот корректный email через интернет. При этом оказывается, что интернет не работает. Вот это уже проблема: программа никак не сможет отправить данные через интернет, если интернет не работает. 📌 #instr || Фронтендщик

На самом деле разница между сбоем и не сбоем весьма расплывчата. Событие, которое одна программа может трактовать как исключительную ситуацию, другая программа может трактовать как некую ошибку, с которой она может справится. Критерий тут следующий: если при возникновении проблемы ваша программа может продолжать выполнять то, для чего она предназначена, то это не исключительная ситуация, а если не может - то да, это исключение. 📌 #instr || Фронтендщик

Все описанные ситуации имеют общую суть: происходит некий сбой, который приводит к невозможности или бессмысленности завершения запланированной операции. Бывают также ситуации, в которой происходит некая ошибка, не являющаяся сбоем. Например, вы спрашиваете у пользователя его email, и он вводит email в некорректном формате. Понятно, что наша программа не может продолжить обрабатывать email, так как он не корректен. Но, тем не менее это - не исключительная ситуация. Наша программа может сама исправить ситуацию: она выведет сообщение об ошибке и пользователь повторит свой ввод. 📌 #instr || Фронтендщик

Когда мы пишем наши программы, мы неявно рассчитываем на то, что все программно-технические механизмы, используемые нами, будут работать корректно. Это, однако, не всегда так. При передаче данных по сети происходит обрыв связи и данные приходят к нам в некорректном виде, или вообще не приходят. При записи файла оказывается, что выделенное нам место на жестком диске закончилось, и файл не может записаться. При чтении файла оказывается, что такого файла не существует и нам не откуда читать. При печати данных на принтере происходит обрыв кабеля, соединяющего принтер и компьютер. 📌 #instr || Фронтендщик

Введение в исключительные ситуации в JavaScript Сейчас мы будем рассматривать исключительные ситуации в JavaScript. Для начала я сделаю некоторое введение, в котором будут примеры исключительных ситуаций вообще для любых языков программирования, а потом разберемся, как дело обстоит в JavaScript. 📌 #instr || Фронтендщик

Давайте переделаем регулярное выражение в строку. В этом случае у нас возникнет проблема с обратным слешем: let reg = new RegExp('\w+'); // не работает  let res = str.match(reg); Для решения проблемы удвоим обратный слеш: let reg = new RegExp('\\w+'); // работает  let res = str.match(reg); 📌 #instr || Фронтендщик

Обратный слеш в строках регулярок в JavaScript В строках с регулярками нужно экранировать (фактически удваивать) обратные слеши. Давайте посмотрим на примере. Пусть у нас есть следующая строка: let str = 'xyz'; Пусть у нас есть следующий код с регулярным выражением: let reg = /\w+/; let res = str.match(reg); 📌 #instr || Фронтендщик

Пусть к этой строке мы применяем следующее регулярное выражение с флагом: let reg = /[a-z]+/g; let res = str.match(reg); Давайте перепишем это регулярное выражение через RegExp: let reg = new RegExp('[a-z]+', 'g');  let res = str.match(reg); 📌 #instr || Фронтендщик

Флаги для строк регулярок в JavaScript Флаги в регулярках, созданных через RegExp, следует передавать вторым параметром. Давайте посмотрим на примере. Пусть у нас есть следующая строка: let str = 'abc def'; 📌 #instr || Фронтендщик

А теперь вставим переменную с помощью шаблонных строк: let pat = 'png|jpg'; let reg = new RegExp(`\.(${pat})$`); let res = str.match(reg); А теперь сформируем часть регулярки из массива: let exts = ['png', 'jpg']; let pat = exts.join('|') let reg = new RegExp(`\.(${pat})$`); let res = str.match(reg); 📌 #instr || Фронтендщик

Давайте теперь вынесем часть регулярки в переменную и вставим ее с помощью конкатенации: let pat = 'png|jpg'; let reg = new RegExp('\.(' + pat + ')$');  let res = str.match(reg); 📌 #instr || Фронтендщик

Пусть к этой строке мы применяем следующее регулярное выражение: let reg = /\.(png|jpg)$/; let res = str.match(reg); Давайте перепишем это регулярное выражение в виде строки. Это делается с помощью специального объекта RegExp: let reg = new RegExp('\.(png|jpg)$'); let res = str.match(reg); 📌 #instr || Фронтендщик

Строка с регуляркой в JavaScript Регулярные выражения можно представлять в виде строк. Это удобно в том случае, если вам необходимо делать вставки переменных в регулярки, либо формировать их динамически. Давайте посмотрим на примере. Пусть у нас есть следующая строка: let str = 'img.png'; 📌 #instr || Фронтендщик

И есть также негативный просмотр назад - (?<! ). В следующем примере замена произойдет, только если перед 'aaa'не стоит 'x': 'baaa'.replace(/(?<!x)aaa/g, '!'); // вернет 'b!'  📌 #instr || Фронтендщик

Просмотр назад Аналогичным образом есть позитивный просмотр назад - (?<= ). В следующем примере замена произойдет, только если перед 'aaa' стоит 'x': 'xaaa'.replace(/(?<=x)aaa/g, '!'); // вернет 'x!'  📌 #instr || Фронтендщик

Давайте применим эти скобки для решения нашей задачи: 'aaax aaab'.replace(/aaa(?=x)/g, '!'); // вернет '!x aaab'  Есть и негативный просмотр вперед - (?! ) - он, наоборот, говорит, что чего-то должно не быть. В следующем примере, замена произойдет, только если после 'aaa' стоит НЕ 'x': 'aaax aaab'.replace(/aaa(?!x)/g, '!'); // вернет 'aaax !b'  📌 #instr || Фронтендщик

Просмотр вперед Для решения задачи нужен способ сказать, что 'x' не следует заменять. Делается это с помощью специальных скобок (?= ), которые просто смотрят, но не забирают с собой. Эти скобки называются позитивный просмотр вперед. Позитивный - так как 'x' (в нашем случае) должен быть - только тогда произойдет замена. 📌 #instr || Фронтендщик

Позитивный и негативный просмотр в регулярках JavaScript Иногда нужно решить задачу такого типа: найти строку 'aaa' и заменить ее на '!',но только если после 'aaa' стоит 'x', а сам 'x' при этом не заменять. Если мы попытаемся решить задачу 'в лоб', то у нас ничего не выйдет: 'aaax baaa'.replace(/aaax/g, '!'); // вернет '! baaa', а хотели '!x baaa'  📌 #instr || Фронтендщик

Пример Сделаем так, чтобы первая пара скобок только группировала, но не клала в карман: let str = 'abab123'; let res = str.match(/(?:ab)+([1-9]+)/); В результате в первом кармане будет наше число: console.log(res[1]); // выведет '123'  📌 #instr || Фронтендщик

Позитивный и негативный просмотр в регулярках JavaScript Иногда нужно решить задачу такого типа: найти строку 'aaa' и заменить ее на '!',но только если после 'aaa' стоит 'x', а сам 'x' при этом не заменять. Если мы попытаемся решить задачу 'в лоб', то у нас ничего не выйдет: 'aaax baaa'.replace(/aaax/g, '!'); // вернет '! baaa', а хотели '!x baaa'  📌 #instr || Фронтендщик