React
29/06/2024

7 dicas de JavaScript que irá te ajudar no dia a dia

Você já passou por aquela situação em pleno desenvolvimento e para fazer uma determinada implementação corriqueira e você não se lembra como tratar um array por exemplo?

Pensando nisso, separamos essas 7 dicas de JavaScript que irão te ajudar no dia a dia!

1. Some todos os valores de um array

Suponha que temos um array de números:

const numbers = [3, 5, 7, 2];

Para somar, geralmente você utiliza um loop de for para ir somando os valores.

const numbers = [3, 5, 7, 2]; let sum = 0; for (let i = 0; i < numbers.length; i++) { sum += numbers[i]; } console.log(sum); // 17

Você pode utilizar o reduce que é uma das funções que vem com array:

const numbers = [3, 5, 7, 2]; const sum = numbers.reduce((total, number) => total + number); console.log(sum); // 17

2. Reduza o tamanho de um array de forma simples

Nós podemos reduzir o tamanho (excluir) do array utilizando a função length.

Temos um array com 5 elementos, utilizando o length retornará o tamanho 5.

let array = [11,12,13,14,15]; console.log(array.length) // 5

Agora suponha que eu quero remover o último item do array.

let array = [11,12,13,14,15]; array.length = 4; console.log(array); // 11, 12, 13, 14

3. Misturar os elementos do array

As vezes todos nós precisamos obter dados aleatórios. Mas tem vezes precisamos obter dados aleatórios de um conjunto de dados específico.

Podemos usar a função sort para resolver esse problema:

const array = [11, 12, 13, 14, 150, 15, 555, 556, 545]; const sortResult = array.sort(() => { return Math.random() - 0.5; }); console.log(sortResult); // 150, 15, 555, 556, 545, 12, 11, 13, 14

A função Math.random() retorno um valor em ponto flutuante(float) entre 0 e 1, e o sort para reordenar espera um valor positivo ou negativo, colocando para subtrair o valor do random por 0.5, nós termos em retorno valores positivos e negativos aleatóriamente, que faz com que o sort trabalhe corretamente.

4. Filtrar valores únicos

As vezes precisamos filtrar valores unicos de um array, para isso utilizamos o metodo new Set().

const array = [11, 12, 12, 222]; const unique = [... new Set(array)]; console.log(unique); // [11, 12, 222]

A função new Set() quando utilizada armazena somente valores únicos, o que nos ajuda a remover valores repetidos.

5. Desestruturando um objeto

As vezes nós precisamos somente de um dado ou de outro de um objeto, com isso nós podemos desestruturá-lo.

const employee = { name: 'Maria', age: 28, address: { city: 'Rio de Janeiro', } }; // Objeto sem desestruturação const name = employee.name; const age = employee.age; const city = employee.address.city console.log(name); // Maria console.log(age); // 28 console.log(city); // Rio de Janeiro // Objeto com desestruturação const { name, age, address: { city }} = employee; console.log(name); // Maria console.log(age); // 28 console.log(city); // Rio de Janeiro

6. Trocar valores com desestruturação de array

Trocar valores nunca foi tão fácil, normalmente, nós introduzimos uma variável temporária.

let x = 5; let y = 10; let temporary = x; let x = y; let y = temporary; console.log(x); // 10 console.log(y); // 5

Mas isso produz uma dor de cabeça, certo?

Bem, agora você pode simplesmente trocar usando a desestruturação de array:

let x = 5; let y = 10; [x,y] = [y,x]; console.log(x); // 10 console.log(y); // 5

7. Substitua as declarações se verdadeiras por &&

Os operadores && são usados com menos frequência, mas agora você usará com mais frequência.

if(twitter) { followme("codando_hard"); }

Podemos torná-lo mais curto usando o operador &&:

twitter && followme("codando_hard");

Conclusão

Analisamos algumas que não são muito utilizadas em JavaScript que podem economizar seu tempo e aumentar a produtividade.

Se você achou isso útil, não deixe de curtir e compartilhar.