O Guia Supremo das Convenções de Nomeação JavaScript

p>Quando há muitos membros a trabalhar num projecto, é uma obrigação ter um certo padrão a seguir por uma questão de escalabilidade.

Hoje vamos falar sobre o padrão mais básico, convenções de nomenclatura: o que devemos e não devemos fazer.

Vamos entrar nele.

// Don’t
function fetchData() {}// Do
function fetchUsers() {}

Sabemos fetchData() chamaria um API e puxaria os dados do servidor, mas que dados? É melhor dar-lhe um nome mais específico, certo? Quanto mais específico, menos tempo irá gastar para pensar sobre o que são os nomes sem quaisquer comentários.

Nomes de uma só carta ovóide

Exceto para os nomes comuns como i para index em declarações em loop, deve evitar nomes de uma só letra porque isso irá confundi-lo mais tarde.

// Don’t
let n = 0;// Do
let number = 0;

Utilizar nomes longos, se necessário

Q com bastante frequência, procuramos nomes curtos. Em alguns casos, contudo, para ser mais claro e descritivo, um nome longo não deve ser um problema.

// Don’t
function findBooks() {}// Do
function findBooksByAuthor() {}

Variáveis

Escrever um comentário apenas para uma definição de variável é mais provavelmente redundante. Um nome de variável deve ser descritivo para que quando o observar saiba exactamente para que é usado.

// Don’t
let d = ‘01/01/2021’;
let number = 28;// Do
let date = ‘01/01/2021’;
let age = 28;

Existem muitos estilos de nomes, contudo, deve usar camelCase para consistência.

// Don’t
let book_title = ‘JavaScript’;
let BOOKTITLE = ‘JavaScript’;
let booktitle = ‘JavaScript’;// Do
let bookTitle = ‘JavaScript’;

Constantes

Constantes em JavaScript não podem ser alteradas. Para separar de outras variáveis, todas as letras de uma constante devem ser UPPERCASE.

// Don’t
const pi = 3.14;// Do
const PI = 3.14;

Booleans

Um booleano é como uma pergunta de sim/não:

• É lido?
• Leve-o a fazer?

>li>É igual?

Hence a forma como nomeia uma variável booleana deve ser semelhante a essas perguntas.

// Don’t
let decoration = true;
let red = true;
let visible = false;// Do
let hasDecoration = true;
let isRed = true;
let isVisible = false;

Funções

Chama-se uma função quando se quer executar uma acção. Assim, um nome de função deve ser iniciado por um verbo.

// Don’t
function data() {}// Do
function fetchData() {}

Você deve favorecer verbos consistentes em vez de ser criativo para o mesmo conceito.

// Don’t
function getUsers() {}
function fetchBooks() {}
function retriveAuthors() {}// Do
function fetchUsers() {}
function fetchBooks() {}
function fetchAuthors() {}

Classes

Como outras linguagens de programação, o nome de uma classe deve seguir PascalCase e um nome de classe deve ser um substantivo.

// Don’t
class mobileDevice {}// Do
class MobileDevice {}

Arquivos

Para ficheiros JavaScript, temos dois estilos comuns de nomenclatura: kebab-case e PascalCase.

kebab-case:

-components/
--product/
---product-details.js
---product-list.js

PascalCase:

-components/
--product/
---ProductDetails.js
---ProductList.js

Pode usar qualquer um deles. Para mim, opto por kebab-case.

Componentes (Reagir)

É específico de Reagir. Devemos usar PascalCase para nomes de componentes.

// Don’t
class profilePicture extends React.Component {
render() {
return <h1>Profile Picture</h1>;
}
}// Do
class ProfilePicture extends React.Component {
render() {
return <h1>Profile Picture</h1>;
}
}

Conclusion

É tudo o que precisa de saber sobre convenções de nomenclatura em JavaScript. Pode marcar esta lista útil e consultá-la mais tarde se necessário.

P>Espera que aprecie este artigo.