Home > Artigos > Código Javascript Limpo - 1 de 5

04-01-2023

Código Javascript Limpo - 1 de 5

Código, Javascript, Limpo - 1 de 5


Não só em javascript, mas em todas as linguagens, existem determinadas regras e princípios que devem ser cumpridos forma a escrever um código "limpo", que não contenha linhas de código desnecessárias, complicadas e que assim seja de fácil leitura e manutenção. Alguns são princípios básicos mas que podem facilmente ser esquecidos por várias razões e que podem tornar a sua evolução muito complicada bem como diminuir a produtividade de quem programa.


Os aspetos que iremos abordar estão mais virados para a linguagem JavaScript com ECMAScript 6  mas em muitos casos podem ser equiparados a outras linguagens de programação.

 

1. SIGNIFICADOS DE VARIÁVEIS

 

Os nomes devem ser simples mas ao mesmo tempo serem capazes de resumir a sua finalidade, serem de fácil entendimento e sem entrar em grandes detalhes. Devem adotar uma notação 'camelCase' quando se junta mais do que uma palavra e deve evitar gírias, abreviações ou ter palavras genéricas e que possam servir para casos diferentes.

 

Maus exemplos:

const TargetSize = 24;
const fndSz = false;
allWords = words.filter(word => {...});
const colorWithHexCode = Color("black", "#000000");


Bons exemplos:

const targetSize = 24;
const foundSize = false;
filteredWords = words.filter(word => {...});
const color = Color("black", "#000000");


Explicações:

Na primeira variável - 'TargetSize' - uma vez que as variáveis não podem conter palavras separadas por espaços, esta deve estar em 'camelCase' para se poder identificar melhor as diferentes palavras que a constituem. Sendo variável deve começar com uma letra minúscula, (tal como nos nomes de funções) sendo as restantes primeiras letras maiúsculas. Se tivermos a falar de classes os seus nomes já devem começar com letra maiúscula e depois seguir o mesmo raciocínio.

Na segunda variável - fnd - apesar de já começar com letra minúscula, as letras fndSz não são claras no seu significado, principalmente se passado alguns meses alguém for fazer manutenção do código.

Na variável 'allWords' existe um problema de deturpação no significado da variável. O resultado daquela variável nunca será 'todas as palavras' mas sim as 'palavras filtradas'.

No último caso temos informação redundante. Redundância nos nomes das variáveis, funções ou mesmo em classes apenas ocupa espaço e confusão na sua interpretação. Os nomes devem estar alinhados com o domínio da solução e ser transversal a todo o código de modo a descrever efetivamente os problemas que se tenta resolver ou identificar. Neste caso, a variável ter apenas o nome 'cor' é o suficiente e bastante percetível e todos os programadores saberão o motivo daquela variável.

 

Maus exemplos:

const list = [24, 26, 28];
const obj = { size: "Twenty four", value: 24 };
if (validateSave(obj)) {
 d.save(obj);
}
const person = {personId: 11111, personFirstName: "Nuno", personLastName: "Matos", personAge: "20"};


Bons exemplos:

const sizes = [24, 26, 28];
const fontSize = {fullName: "Twenty four", value: 24};
const isFontSizeValid = validateFontSize(fontSize.value);
if (isFontSizeValid) {
 database.save(color);
}
const person = {id: 11111, firstName: "Nuno", lastName: "Matos", age: "20"};


Explicações:

A variável - list - apesar do significado que se quer dar ser uma lista, se um programador encontrar essa variável no meio do código, não vai perceber que tipo de lista essa variável contem, isto é, se será de tamanhos de cores ou de outra coisa qualquer. Se trocarmos o list por sizes já fica mais claro, e por estar no plural, que será uma lista de tamanhos.

No caso da variável - obj - para além de o próprio nome ter problemas já mencionados anteriormente, tratando-se de uma variável que contém um objeto, faria mais sentido a key 'size' chamar-se mesmo 'name' uma vez que se trata de uma característica do texto, isto é, o texto irá ter o valor 24 e o seu nome por extenso é 'Twenty four'. Na instrução seguinte, em que se avalia o variável obj através de uma condição if, ficaria mais correto se fizéssemos esses passos separadamente e de forma mais legível, de modo que se perceba o que estamos efetivamente a avaliar, isto é, fazer uma função que valida se um determinado tamanho é o correto e colocar esse valor numa variável que possa ser usada em vários sítios, como por exemplo antes de guardar numa tabela na base de dados.

Por último, a variável - person - que descreverá um objeto 'pessoa', todas as suas chaves não precisam de ter o nome 'pessoa' agarrado, como 'nomeDaPessoa' ou 'moradaDaPessoa', isto é, 'nome' e 'morada' seria suficiente.

 

Artigos Relacionados:

 

  

👉 Follow @niuGIS

RELACIONADAS


05-05-2023
ECMAScript

Contacte-nos 214 213 262

Informações