​Как валидировать форму на js?

Как сделать так, чтобы пользователь мог вводить только цифры в поле с паспортом? А только буквы русского алфавита в поле “Имя”? Для этого существует метод regexp.

Например, создадим переменную myDream.

let myDream = "Я хочу научиться программировать"

/хочу/.test(myDream); возвращает нам true, потому что слово “хочу” в фразе "Я хочу научиться программировать" есть.

А выражение:

/играть на барабане/.test(myDream); возвращает false, т.к. фразы “играть на барабане” в myDream нет.

Однако, мы можем искать не только слова, но и цифры. Для этого используется запись \d.

/\d/.test('1234') говорит нам о том, есть ли в записи хотя бы одно число.

Кстати, можно использовать более человеко читаемую форму, которая выглядит как:

/[0-9]/.test(’1234’)

Перейдем к более практичным примерам. Предположим, что нам нужна валидация на поле возраста, где пользователь может ввести одну или две цифры. Выглядеть она будет так:

/^[0-9]{1,2}$/.test('12')

^ - сигнализирует о начале строки. Мы начинаем искать выражение не с середины, ни с конца, а с начала.

$ - сигнализирует о конце строки. Мы заканчиваем искать выражение не после первого найденного, а идем до конца строки полностью.

[0-9] - это мы знаем. Ищем цифры от 0 до 9.

{1,2} - интересует, чтобы пользователь ввел 1 или 2 символа. Так, строка из трех символов “123” уже не подойдет.

Интерес представляет regexp, когда пользователь может вводить только русские символы. Выглядеть это будет:

/^[А-ЯЁа-яё]+$/.test('Елена')

А если только латинские (например, фамилия в загранпаспорте):

/^[a-zA-Z]+$/.test(‘Fedorova’)

Бывает, что интересуют латинские символы, цифры и пробел:

/^[A-Za-z0-9\s]+$/.test('apartment 15')

В общем, логика ясна. Прочитать подробнее про regexp на английском можно здесь, на русском - здесь, а попрактиковаться онлайн тут.

Про regexp я заговорила потому, что попалось задание:

- вернуть true, если фраза содержит все буквы латинского алфавита хотя бы по 1 разу ("The quick brown fox jumps over the lazy dog");
- вернуть false в противном случае.

Попробуйте выполнить его и вы, когда закончите все остальное.