Проверка номера телефона в JavaScript: методы и примеры

Вот несколько методов проверки номера телефона JavaScript:

  1. Регулярные выражения. Одним из распространенных подходов является использование регулярных выражений для сопоставления и проверки номеров телефонов. Вы можете определить шаблон регулярного выражения, соответствующий желаемому формату номера телефона, а затем проверить, соответствует ли данный номер телефона этому шаблону. Например, вы можете использовать следующее регулярное выражение для проверки 10-значного номера телефона в США:
function validatePhoneNumber(phoneNumber) {
  var pattern = /^\d{3}-\d{3}-\d{4}$/;
  return pattern.test(phoneNumber);
}
console.log(validatePhoneNumber("123-456-7890")); // true
console.log(validatePhoneNumber("1234567890")); // false
  1. Библиотеки номеров телефонов. Другой вариант — использовать библиотеки JavaScript, специально разработанные для проверки номеров телефонов. Одной из популярных библиотек является libphonenumber от Google, которая предоставляет широкие возможности анализа, форматирования и проверки номеров телефонов. Вы можете установить его с помощью менеджера пакетов, например npm, а затем использовать его функции для проверки номеров телефонов.
// Example using libphonenumber library
var PhoneNumberUtil = require('google-libphonenumber').PhoneNumberUtil;
var phoneUtil = PhoneNumberUtil.getInstance();
function validatePhoneNumber(phoneNumber, countryCode) {
  try {
    var number = phoneUtil.parseAndKeepRawInput(phoneNumber, countryCode);
    return phoneUtil.isValidNumber(number);
  } catch (e) {
    return false;
  }
}
console.log(validatePhoneNumber("123-456-7890", "US")); // true
console.log(validatePhoneNumber("1234567890", "US")); // false
  1. Маскирование ввода. Маскирование ввода можно использовать для обеспечения соблюдения определенного формата номера телефона при вводе пользователем. Вы можете использовать библиотеки, такие как Inputmask или Cleave.js, чтобы применить предопределенную маску к полю ввода и проверить введенный номер телефона по маске.

  2. Атрибут шаблона HTML5. Если вы работаете с HTML-формами, вы можете использовать атрибут шаблона для применения определенного шаблона номера телефона. Например:

<input type="text" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" required>

Если введенный номер телефона не соответствует указанному шаблону, отобразится сообщение об ошибке проверки.