9

Fiz um gerador de CPF em JavaScript e, queria saber se o meu código está bom ou o que eu posso melhorar nele?

Função que vai ser chamada pelo evento onsubmit

function gerarCpf() {
var cpf = document.getElementById("cpf");

var num1 = aleatorio().toString();
var num2 = aleatorio().toString();
var num3 = aleatorio().toString();

var dig1 = digPri(num1,num2,num3);
var dig2 = digSeg(num1,num2,num3,dig1);
cpf.value = num1+"."+num2+"."+num3+"-"+dig1+""+dig2;}

Função que calcula o primeiro dígito verificador

function digPri(n1,n2,n3) {
var nn1 = n1.split("");
var nn2 = n2.split("");
var nn3 = n3.split("");
var nums = nn1.concat(nn2,nn3);

var x = 0;
var j = 0;
for (var i=10;i>=2;i--) {
    x += parseInt(nums[j++]) * i;
}
var y = x % 11;
if (y < 2) {
    return 0;
} else {
    return 11-y;
}}

Função que calcula o segundo dígito verificador

function digSeg(n1,n2,n3,n4) {
var nn1 = n1.split("");
var nn2 = n2.split("");
var nn3 = n3.split("");
var nums = nn1.concat(nn2,nn3);
nums[9] = n4;
var x = 0;
var j = 0;
for (var i=11;i>=2;i--) {
    x += parseInt(nums[j++]) * i;
}
var y = x % 11;
if (y < 2) {
    return 0;
} else {
    return 11-y;
}}

Função que retorna número aleatório com 3 dígitos fixos

function aleatorio() {
var aleat = Math.floor(Math.random() * 999);
if (aleat < 100) {
    if (aleat < 10) {
        return "00"+aleat;
    } else {
        return "0"+aleat;
    }
} else {
    return aleat;
}}
1
  • 2
    Recomendo indentar melhor.... 8/10/2017 às 19:26

1 Resposta 1

12

A maior melhoria a fazer no seu código é o transformar das duas funções de geração dos dígitos verificadores numa só, uma vez que são quase iguais.

Tem também vários outros pormenores tanto de escrita como de estruturação que pode melhorar.

Poderia ficar assim:

//obtem o elemento apenas uma vez no inicio em vez de todas as vezes que gera o cpf
const cpf = document.getElementById("cpf"); 

function gerarCpf() {
  const num1 = aleatorio(); //aleatorio já devolve string, logo não precisa de toString
  const num2 = aleatorio();
  const num3 = aleatorio();

  const dig1 = dig(num1, num2, num3); //agora só uma função dig
  const dig2 = dig(num1, num2, num3, dig1); //mesma função dig aqui

  //aqui com interpolação de strings fica bem mais legivel
  return `${num1}.${num2}.${num3}-${dig1}${dig2}`;
}

//o quarto parametro(n4) só será recebido para o segundo digito
function dig(n1, n2, n3, n4) { 
  
  //as concatenações todas juntas uma vez que são curtas e legíveis
  const nums = n1.split("").concat(n2.split(""), n3.split(""));
  
  if (n4 !== undefined){ //se for o segundo digito coloca o n4 no sitio certo
    nums[9] = n4;
  }
  
  let x = 0;
   
  //o j é também iniciado e incrementado no for para aproveitar a própria sintaxe dele
  //o i tem inicios diferentes consoante é 1º ou 2º digito verificador
  for (let i = (n4 !== undefined ? 11:10), j = 0; i >= 2; i--, j++) {
    x += parseInt(nums[j]) * i;
  }
  
  const y = x % 11;
  //ternário aqui pois ambos os retornos são simples e continua legivel
  return y < 2 ? 0 : 11 - y; 
}

function aleatorio() {
  const aleat = Math.floor(Math.random() * 999);
 //o preenchimento dos zeros à esquerda é mais facil com a função padStart da string
  return ("" + aleat).padStart(3, '0'); 
}

cpf.value = gerarCpf();
<input type="text" id="cpf">

Note também que optei por transformar todas as declarações em let ou const que são as formas mais modernas e corretas de fazer hoje em dia.

Sem comentários

Segue o mesmo código sem comentários para poder copiar daqui e utilizar sem ter as explicações em texto:

const cpf = document.getElementById("cpf"); 

function gerarCpf() {
  const num1 = aleatorio();
  const num2 = aleatorio();
  const num3 = aleatorio();
  const dig1 = dig(num1, num2, num3);
  const dig2 = dig(num1, num2, num3, dig1);
  return `${num1}.${num2}.${num3}-${dig1}${dig2}`;
}

function dig(n1, n2, n3, n4) { 
  const nums = n1.split("").concat(n2.split(""), n3.split(""));
  if (n4 !== undefined){ 
    nums[9] = n4;
  }
  
  let x = 0;
  for (let i = (n4 !== undefined ? 11:10), j = 0; i >= 2; i--, j++) {
    x += parseInt(nums[j]) * i;
  }
  
  const y = x % 11;
  return y < 2 ? 0 : 11 - y; 
}

function aleatorio() {
  const aleat = Math.floor(Math.random() * 999);
  return ("" + aleat).padStart(3, '0'); 
}

cpf.value = gerarCpf();
<input type="text" id="cpf">

Code Golf

A titulo de curiosidade e graça, e numa tentativa de fazer um pouco de Code Golf no seu código para o deixar super curto a nível de escrita (embora não muito legível) poderia fazer assim:

function gerarCpf() {
  const n1 = aleatorio(), n2 = aleatorio(), n3 = aleatorio(), d1 = dig(n1, n2, n3);
  return `${n1}.${n2}.${n3}-${d1}${dig(n1, n2, n3, d1)}`;
}

function dig(n1, n2, n3, n4) { 
  let nums = n1.split("").concat(n2.split(""), n3.split(""), [n4]), x = 0;  
  for (let i = (n4 !== undefined ? 11:10), j = 0; i >= 2; i--, j++) x += +nums[j] * i;
  return (y = x % 11) < 2 ? 0 : 11 - (y = x % 11); 
}

const aleatorio = () => ("" + Math.floor(Math.random() * 999)).padStart(3, '0');

document.getElementById("cpf").value = gerarCpf();
<input type="text" id="cpf">

6
  • Declarar como let e const tem algum impacto na performance ou é somente estético? 8/10/2017 às 20:10
  • 1
    Em relação ao const ajuda a validar quando estamos a alterar algo que não era suposto, assim como abre mais possibilidades de optimização do código em si. Quanto ao let pode ter implicações no que respeita closures e ser ligeiramente mais lento que o var dependendo dos códigos, mas acaba por garantir escopo fugindo a outros tipos de problemas. No geral quaisquer perdas/ganhos a nível de performance para const e let são mínimos e não apresentam impacto real nas demais aplicações.
    – Isac
    8/10/2017 às 20:18
  • 1
    @FilipeRicardo A titulo de curiosidade, achei um jsperf que compara var, let e const em performance. Veja aqui. Na minha maquina as diferenças foram na ordem de 2-4%.
    – Isac
    8/10/2017 às 20:38
  • 1
    @JulioHenrique Esse código acabei por apenas fazer melhoria do que estava na pergunta a nível de código e legibilidade mas mantendo a lógica. Vou dar uma olhada nas regras do CPF a ver se vejo o problema e já ca volto para dizer qualquer coisa.
    – Isac
    19/02/2021 às 13:59
  • 1
    @JulioHenrique Na verdade tinha sido um bug que eu tinha introduzido na refatorização, que afetava apenas quando o CPF tinha o primeiro digito verificador como 0. Neste momento ficou resolvido. Obrigado pelo comentário.
    – Isac
    19/02/2021 às 23:29

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .