Você pode utilizar uma expressão regular.
É uma string que define um padrão de busca. É um algoritmo. Podemos
dizer que ela é uma linguagem para localização de padrões em texto. Veja: O que é uma expressão regular?
O JavaScript possui o RegExp.prototype.test()
, que retorna true
ou false
para sua validação.
A expressão regular que utilizo para validar telefones brasileiros é o seguinte:
/^\(\d{2}\) \d{4,5}-\d{4}$/gi
{início da linha}({dois dígitos}) {de quatro a cinco dígitos}-{quatro dígitos}{fim da linha}
Essa expressão aceitará telefones no formato (XX) XXXX-XXXX
e (XX) XXXXX-XXXX
.
Para testar uma string contra ela, pode utilizar o test()
:
const isValidPhone = (phone) => {
const brazilianPhoneRegex = /^\(\d{2}\) \d{4,5}-\d{4}$/gi;
return brazilianPhoneRegex.test(phone);
};
isValidPhone("(41) 99778-2914");
// true
isValidPhone("(411) 99778-2914");
// false
isValidPhone("(41) 9778-2914");
// true
Se você quiser ser mais permissivo, eu faria de outra maneira. Pegaria o string de input, retiraria tudo que não é numérico e verificaria se ele tem de 10 a 11 dígitos, que é o formato do telefone com DDD de dois dígitos. Isso ficaria da seguinte forma:
const isValidPhone = (phone) => {
const sanitizedPhone = phone.replace(/\D/g,'');
return sanitizedPhone.length >= 10 && sanitizedPhone.length <= 11;
};
isValidPhone("(41) 99778-2914");
// true
isValidPhone("()41A977B8-----8319");
// true, pois tira todo caractere que não é numérico
Para a máscara, pode usar o jQuery, como você mesmo sugeriu. Para não reinventarmos a roda, existem algumas perguntas no Stack Overflow em Português que já responderam ela: Máscara de telefones usando jQuery Mask Plugin
Se quiser estender ou testar a expressão regular, eu utilizo bastante o site RegExr.