Código limpo em Javascript: 12 dicas para escrever códigos legíveis
Ao longo da minha jornada como programador, descobri que escrever código não é uma tarefa muito simples, não é apenas sobre criar algo que funcione, é sobre criar algo que é eficiente, sustentável e acima de tudo legível. Cada linha de código, cada variável e cada função se tornaram reflexos do meu compromisso com a excelência. Afinal, no dinâmico ecossistema do desenvolvimento frontend, a legibilidade e eficiência do código são indispensáveis. Ao adotar práticas de código limpo, não só melhorei minha habilidade técnica, mas também contribuí para um ambiente de desenvolvimento mais colaborativo.
História e origem do código limpo:
A busca pela clareza no código não é uma invenção recente, desde os primeiros dias de programação, os pioneiros da indústria compreenderam o valor de um código que fosse não apenas funcional, mas também compreensível. Foi essa compreensão que levou Robert C. Martin a escrever o “Clean Code” um livro que muitos inclusive eu consideram a principal referência sobre programação limpa. Para mim, a primeira vez que me deparei com este livro percebi que estava diante de um mar de conhecimento. As páginas de “Clean Code” não só iluminaram os princípios da programação limpa na minha mente, mas também serviram como um guia em minha própria evolução como desenvolvedor.
O impacto desse livro na comunidade de desenvolvimento é inegável, ele não apenas fornece técnicas, mas também filosofias que orientam a mentalidade de codificação. E embora muitas linguagens e frameworks tenham surgido desde a sua publicação, os ensinamentos de Martin permanecem tão relevantes hoje quanto eram então.
![Foto de Robert C. Martin segurando o seu livro Clean Code](https://frontendemfoco.com.br/wp-content/uploads/2023/09/clean-code-2.jpg)
Benefícios de um código limpo em JavaScript:
Durante minha jornada como programador, uma coisa ficou clara: a qualidade do código importa. Principalmente em JavaScript, uma linguagem tão versátil, mas também infame por seus desafios. A decisão de se dedicar ao código limpo foi sem dúvida um divisor de águas na minha carreira. E aqui quero compartilhar por que acredito que todo desenvolvedor deve fazer o mesmo.
1. Manutenção mais fácil:
Código limpo significa menos tempo depurando e mais tempo adicionando novas funcionalidades.
// Antes
function p(d) {
return d*2;
}
// Depois (Código Limpo)
function dobrarValor(numero) {
return numero * 2;
}
2. Colaboração aprimorada:
Quando trabalho em equipe, um código bem estruturado permite que meus colegas compreendam e contribuam sem problemas.
// Antes
function add(v1, v2) {
return v1+v2;
}
// Depois (Código Limpo)
function somarValores(valor1, valor2) {
return valor1 + valor2;
}
3. Desempenho otimizado:
Em meus projetos, notei que um código organizado e simplificado tende a ser mais útil e eficiente.
// Antes
const arr = [1,2,3,4,5];
for(let i = 0; i <= arr.length; i++) {
console.log(arr[i]);
}
// Depois (Código Limpo)
const numeros = [1,2,3,4,5];
numeros.forEach(numero => {
console.log(numero);
});
4. Satisfação Pessoal:
Há um orgulho genuíno em olhar para um código bem escrito.
Princípios básicos do código limpo
![Imagem do livro clean code](https://frontendemfoco.com.br/wp-content/uploads/2023/09/clean-code-3.png)
Robert C. Martin, amplamente conhecido como “Uncle Bob” na indústria de software, é um ícone quando falamos de desenvolvimento ágil e especialmente sobre o conceito de código limpo. Em seu livro seminal, “Clean Code: A Handbook of Agile Software Craftsmanship“, ele não apenas exibe técnicas, mas aborda uma filosofia mais profunda sobre o que significa escrever código de alta qualidade.
O tio Bob nos convida a perceber que o código não é apenas para máquinas, é primordialmente para humanos. Os princípios apresentados em “Clean Code” são mais do que diretrizes técnicas: são a manifestação da paixão pela excelência e da busca incessante pela melhoria contínua. O autor defende que um código verdadeiramente limpo é aquele que é legível, reutilizável e refatorável e que um desenvolvedor responsável é aquele que o mantém assim.
Essa visão de Martin, embora universal tem implicações particulares para cada linguagem de programação. No caso do JavaScript, uma linguagem amplamente usada e muitas vezes criticada por suas peculiaridades, aplicar os princípios do “Clean Code” pode ser tanto um desafio quanto uma oportunidade. Ao longo deste capítulo veremos exemplos concretos em JavaScript, demonstrando como os princípios do código limpo podem ser aplicados na prática nesta linguagem específica.
1. Nomes significativos:
Minha visão: Uma das maiores revelações que tive foi o poder de um nome bem escolhido. Os nomes de variáveis, funções e classes devem ser claros e descrever exatamente o que fazem.
Visão do Autor: Robert C. Martin, enfatiza a importância de nomes significativos no código. Para ele, um nome adequado tem o poder de revelar intenção, tornar o código autoexplicativo e reduzir a necessidade de comentários. Ele acredita que, ao escolher nomes precisos e descritivos para variáveis, funções e classes, os desenvolvedores não apenas tornam o código mais compreensível, mas também promovem a manutenção e colaboração mais eficientes entre as equipes.
// Pouco claro
const d = new Date();
// Claro
const currentDate = new Date();
2. Funções pequenas e focadas:
Minha visão: Em vez de criar funções longas e complexas, divida-as em funções menores, cada uma com um propósito específico.
Visão do Autor: Robert C. Martin destaca, em “Clean Code”, a essência das funções serem pequenas e focadas. Ele defende que uma função deve fazer uma coisa só, fazê-la bem e fazê-la apenas. Martin sugere que funções menores são mais fáceis de nomear de forma descritiva, mais simples para entender e testar, e promovem a reutilização e modularidade. A redução de responsabilidades em unidades isoladas facilita a legibilidade e a manutenção, contribuindo para códigos mais claros e eficientes.
// Complexo
function processData(data) {
// código para validar dados
// código para transformar dados
// código para enviar dados
}
// Limpo e Dividido
function validateData(data) {...}
function transformData(data) {...}
function sendData(data) {...}
3. Evite comentários desnecessários:
Minha visão: Na minha experiência, um código bem escrito deve ser autodescritivo. Em vez de usar comentários para explicar o que uma linha de código faz, use nomes de variáveis e funções claros.
Visão do Autor: Robert C. Martin, em “Clean Code”, argumenta que um código bem escrito deve se explicar por si só, tornando os comentários, muitas vezes desnecessários. Para ele, comentários excessivos podem ser indícios de um código de baixa qualidade, pois tentam compensar a falta de clareza do próprio código. Enquanto alguns comentários são inevitáveis e úteis, a dependência excessiva deles pode tornar o código mais confuso e difícil de manter. Martin incentiva os desenvolvedores a escreverem códigos tão claros e autoexplicativos que a necessidade de comentários seja minimizada.
4. DRY – Don’t Repeat Yourself:
Minha visão: Ao longo da minha carreira, muitas vezes encontrei e criei códigos repetidos. A reutilização de código não apenas economiza tempo, mas também reduz a chance de erros.
Visão do Autor: No livro “Clean Code”, Robert C. Martin destaca a importância do princípio “DRY – Don’t Repeat Yourself”. Ele enfatiza que a repetição de código leva a duplicações, tornando o software mais difícil de modificar e manter. Para Martin, o código duplicado é um dos principais culpados por bugs e dificuldades de manutenção. Ao aderir ao princípio DRY, os desenvolvedores garantem que cada pedaço de conhecimento tenha uma única e clara representação no sistema, aumentando a eficiência e reduzindo erros.
// Repetido
let xValue = getX();
let yValue = getY();
// DRY
const [xValue, yValue] = getValues();
5. Tratamento adequado de erros:
Minha visão: Trate erros de maneira proativa e clara para que quando ocorrerem sejam fáceis de diagnosticar e corrigir.
Visão do Autor: Em “Clean Code”, Robert C. Martin salienta que o tratamento adequado de erros é vital para a criação de um código confiável e robusto. Ele defende que os erros devem ser tratados com seriedade e que o código deve ser preparado para lidar com falhas, sem deixar que elas se propaguem. Para Martin, o tratamento de erros não é uma reflexão tardia, mas sim uma parte integral da lógica do programa, e silenciar ou ignorar erros pode levar a consequências indesejadas e bugs ocultos.
// Básico
function fetchData() {
return data;
}
// Com manuseio de erro
function fetchData() {
if (!data) {
throw new Error('Data not found');
}
return data;
}
Maus hábitos comuns em JavaScript
Durante minha jornada como programador, observei que muitos colegas, inclusive eu mesmo, caíam em armadilhas comuns ao escrever código JavaScript. A verdade é que, embora o JavaScript seja uma linguagem poderosa e flexível, essa mesma flexibilidade pode nos levar a cometer erros frequentes. Eis alguns dos maus hábitos mais comuns que identifiquei e os quais todo desenvolvedor deve estar atento.
1. Uso de variáveis globais:
Declarações globais podem causar conflitos e tornar o código menos previsível.
// Não recomendado
var globalVar = "I'm global!";
// Recomendado
function myFunction() {
var localVar = "I'm local!";
}
2. Não utilizar ‘strict mode’:
Ao utilizar o 'strict mode'
, o JavaScript lança erros para ações “inseguras”, como a atribuição de valores a variáveis não declaradas, o que, em modo normal, simplesmente criaria uma variável global. Esse modo também proíbe o uso de algumas palavras-chave reservadas, impede a definição duplicada de propriedades de objeto, entre outros.
function assignValue() {
undeclaredVariable = "Hello World!";
}
assignValue();
console.log(undeclaredVariable); // Isto imprime "Hello World!" mesmo que a variável não tenha sido declarada.
"use strict";
function assignValue() {
undeclaredVariable = "Hello World!";
}
assignValue(); // Isto lança um erro, porque undeclaredVariable não foi declarada.
Com o surgimento de frameworks modernos e ferramentas de build, muitas vezes não precisamos nos preocupar em inserir explicitamente o ‘strict mode’. Frameworks como React e Angular, bem como ferramentas de empacotamento como Webpack e Babel, já tratam o código JavaScript em ‘strict mode’ por padrão.
3. Uso incorreto do ==
em vez do ===
:
A comparação de igualdade ==
faz a comparação entre os valores de duas variáveis independente de tipo, enquanto ===
verifica tanto o valor quanto o tipo.
// Não recomendado
if (0 == "0") // retorna true
// Recomendado
if (0 === "0") // retorna false
Conclusão: Reflexões de uma jornada programática
Na programação, cada decisão, cada linha de código e cada ferramenta se tornaram pedras fundamentais em minha trajetória. Atravessando altos e baixos, aprendi que a programação vai além de simplesmente escrever códigos; trata-se de resolver problemas, inovar e acima de tudo, crescer constantemente.
Cada desafio superado reforçou minha paixão e resiliência, enquanto os erros cometidos tornaram-se oportunidades de aprendizado inestimáveis. A tecnologia e as linguagens de programação estão em constante evolução, mas uma coisa permanece constante: a necessidade de adaptabilidade e a busca incessante pelo conhecimento.
Ao olhar para trás, percebo o quão fundamental foi ter as ferramentas e recursos certos à disposição. Estes não só otimizaram meu fluxo de trabalho, mas também moldaram meu pensamento e abordagem em relação ao desenvolvimento.
E se há algo que gostaria de compartilhar com os futuros programadores ou colegas de profissão, é esta reflexão: abrace cada desafio, esteja sempre pronto para aprender e nunca subestime o impacto de uma boa ferramenta ou recurso em sua jornada.
Leia mais em nosso blog.