Lodash: o que é e como usar essa biblioteca Javascript! | Insights para te ajudar na carreira em tecnologia | Blog da Trybe
O Javascript é uma das linguagens de programação mais usadas no desenvolvimento de aplicações web. Afinal, essa tecnologia possibilita a criação de páginas dinâmicas e interativas de forma simples. Contudo, ao longo dos anos, diversas ferramentas foram criadas para tornar o uso dessa linguagem ainda mais prático. Uma delas é a biblioteca Lodash.
Quando usada, a Lodash permite à pessoa programadora elaborar códigos de forma mais simples e rápida. Isso porque a biblioteca foi criada para oferecer um conjunto de funções para facilitar o tratamento de tarefas complexas do desenvolvimento.
Para que você possa conhecer essa ferramenta mais a fundo, neste post vamos mostrar:
Como funciona a Lodash?
Por que usar Lodash?
Como usar Lodash?
Lodash é uma biblioteca Javascript que fornece um conjunto de funções para que a pessoa programadora possa trabalhar com mais facilidade em tarefas que envolvam a manipulação de matrizes, strings, objetos, números, etc.
Ela é conhecida por ser a sucessora da biblioteca Underscore e pela simplicidade que ela traz para a criação de códigos. Afinal, tarefas que gastariam várias linhas de código para serem feitas podem ser realizadas em uma única linha, bastando apenas chamar a função Lodash equivalente.
Trata-se também de uma biblioteca open source, que tem seu código disponível para contribuições no Github. No mais, a Lodash utiliza o paradigma de programação funcional, o que favorece a elaboração de métodos mais objetivos, garantindo uma boa modularidade e maior qualidade de código.
Agora que você já sabe o que é Lodash, deve estar se perguntando sobre o que essa biblioteca oferece na prática. Para responder essa dúvida, vamos mostrar um pouco mais de suas características e funções. Veja!
As funções da Lodash são agrupadas em 13 categorias diferentes, sendo elas:
Em cada uma das categorias listadas você vai encontrar métodos para lidar com problemas específicos de codificação. A categoria Array, por exemplo, fornece funções para manipulação de matrizes. Já a categoria Math apresenta funções matemáticas, como métodos de soma, divisão e multiplicação.
É interessante ressaltar que os métodos disponibilizados por essa biblioteca sempre iniciam com os caracteres " _." seguidos pelo nome da respectiva função. Abaixo, conheça o funcionamento de algumas das principais funções da Lodash!
A função _.concat() é usada para concatenar um array existente a um novo conjunto de valores. Para isso, ela cria um outro array no qual os valores serão concatenados, como mostramos no exemplo abaixo:
let novoArray = _.concat(array, 40, 50, 60);
//novoArray receberá os valores => [10, 20, 30, 40, 50, 60]
A função _.find() pode ser usada para substituir um loop para iterar sobre os elementos de uma matriz. Com ela, podemos encontrar um objeto específico dentro da matriz de forma simples e rápida usando várias chaves. Veja:
let listaDeEstudantes = [
{nome: 'Beatriz', sobrenome: 'Machado', idade: 20},
{nome: 'Matheus', sobrenome: 'Gomes', idade: 19},
{nome: 'Fred', sobrenome: 'Moura', idade: 23}
let estudanteIdade = _.find(listaDeEstudantes, function(o) {return o.idade < 20;});
console.log(estudanteIdade);
//retorna o objeto com idade menor que 20 => {nome: 'Matheus', sobrenome: 'Gomes', idade: 19}
let estudanteSobrenome = _.find(listaDeEstudantes, {sobrenome: 'Moura'});
console.log(estudanteSobrenome);
//retorna o objeto com sobrenome "Moura" => {nome: 'Fred', sobrenome: 'Moura', idade: 23}
Perceba que a chave usada na primeira busca foi a idade. Já na segunda usamos o sobrenome para fazer a pesquisa.
Usando a função _.intersection() é possível identificar quais são os valores que se repetem dentro de duas matrizes diferentes. O método pode ser aplicado da seguinte forma:
let primeiroArray = ['gato', 'cachorro', 'pato', 'peixe', 'hamster']
let segundoArray = ['cobra', 'galinha', 'pato', 'cavalo', 'gato']
let valoresIguais = _.intersection(primeiroArray, segundoArray);
console.log(valoresIguais);
//valoresIguais receberá => ['gato', 'pato']
Conforme foi explicado, Lodash oferece diversas funções para facilitar a codificação com Javascript. Na prática, o seu uso traz muitas vantagens para quem programa e não podemos deixar de falar sobre isso, certo? Veja mais sobre esses benefícios logo abaixo!
Ajuda a escrever código limpo
Um dos melhores benefícios proporcionados pelo uso da Lodash é a aplicação do conceito de Clean Code, ou código limpo. De acordo com essa técnica, um código de qualidade deve ser organizado, fácil de ler e de boa manutenção. O contrário disso seria um código repetitivo, com funções complexas e cheias de loops.
Ao aplicar a Lodash no seu projeto, esse tipo de erro pode ser evitado. Isso porque a sua codificação será simplificada e você não vai precisar escrever inúmeras linhas para fazer o tratamento de dados ou para resolver problemas comuns na programação, como a ordenação de valores de uma matriz.
Outro benefício que pode ser observado quando se utiliza a Lodash é a redução de código repetitivo. Durante a codificação, é comum que a pessoa programadora acabe criando mais de um método para resolver problemas parecidos. Com isso, o código acaba ficando poluído e inconsistente, o que prejudica a legibilidade. Por outro lado, com a Lodash nada disso acontece. Afinal, cada função da biblioteca tem um objetivo bem definido e pode ser aplicada em apenas uma linha de código sempre que for necessário.
É fácil de aprender e implementar
Um dos motivos que podemos citar para você utilizar a Lodash é a facilidade de aprendizado dessa biblioteca. Isso ocorre pois as funções que ela fornece são bastante intuitivas e você só precisa entender o que elas fazem para poder aplicá-las no código.
A documentação dessa ferramenta também é bastante completa e conta até com exemplos que podem ser testados na própria página oficial da Lodash. No mais, para utilizá-la, basta instalar e chamar as funções no código Javascript, o que torna a sua implementação extremamente fácil.
Garante mais agilidade e produtividade
Por fim, o aumento na produtividade é mais um motivo para você usar Lodash. Como falamos, essa biblioteca favorece a escrita de código simples e enxuto, o reaproveitamento de funções e ainda é muito fácil aprender a usá-la. Tudo isso faz com que a codificação seja mais ágil.
Por consequência, sua produtividade também aumenta, sendo possível finalizar seus projetos em menos tempo. O melhor de tudo é que essa agilidade não compromete a qualidade do código, visto que ele também vai ser menos complexo e de fácil entendimento.
Agora que você já sabe quais são as vantagens que a Lodash oferece, deve estar se perguntando sobre como você pode utilizá-la na prática, não é mesmo? Para explicar esse ponto, vamos mostrar as formas de instalação dessa biblioteca, além de um exemplo prático de como aplicar suas funções em um código. Veja!
A instalação da Lodash pode ser feita de várias formas. Para usá-la no navegador, por exemplo, é preciso incluir a biblioteca por meio de uma tag script no seu documento HTML. Dessa forma:
Já para fazer a instalação via NPM, basta utilizar os seguintes comandos:
Com a instalação completa, você já pode fazer o import da biblioteca dentro do arquivo Javascript. Desse modo:
Por fim, para utilizar a biblioteca Lodash completa com Node.js devemos usar:
Usando Lodash na prática
Agora que as formas de instalação da Lodash foram explicadas, observe um exemplo prático de uso dessa biblioteca para a ordenação de valores. No método que será mostrado, vamos pegar os elementos de um array chamado "listaDeEstudantes" e filtrá-los para selecionar apenas os que estiverem cadastrados com gênero feminino.
Em seguida, eles serão ordenados de forma crescente pela idade. Feito isso, selecionaremos apenas o nome de cada objeto para juntá-los em uma string e separá-los por vírgula.
Para isso, iremos usar as seguintes funções da Lodash:
_.chain(): permite o encadeamento de várias funções;
_.filter(): filtra os objetos de acordo com a chave fornecida;
_.sortBy(): ordena os elementos de acordo com o critério estabelecido;
_.map(): cria uma matriz para guardar os valores após iterar sobre um array;
_.join(): converte os elementos de um array em string e faz a separação dos valores dado um separador.
Abaixo, observe o exemplo em que essas funções são aplicadas:
{nome: 'Beatriz', sobrenome: 'Machado', gênero: 'feminino', idade: 20},
{nome: 'Matheus', sobrenome: 'Gomes', gênero: 'masculino', idade: 19},
{nome: 'Laura', sobrenome: 'Matos', gênero: 'feminino', idade: 24},
{nome: 'Fred', sobrenome: 'Moura', gênero: 'masculino', idade: 23},
{nome: 'Sabrina', sobrenome: 'Nelles', gênero: 'feminino', idade: 21}
let listaOrdenada = _.chain(listaDeEstudantes)
.filter({gênero: 'feminino'})
.sortBy('idade')
.map('nome')
//listaOrdenada receberá => "Beatriz, Sabrina, Laura"
Como mostramos, a biblioteca Lodash é extremamente versátil e fácil de ser usada. Além dos métodos que mostramos, ela ainda apresenta diversos outros recursos, que podem ser conferidos na sua documentação completa. No mais, lembre-se que Lodash é uma ferramenta para simplificar sua codificação, mas é sempre bom praticar resolver problemas de forma manual para aprimorar seus conhecimentos em programação!
Este conteúdo foi útil para você? Então, para aprofundar seus conhecimentos sobre bibliotecas Javascript, conheça o React e entenda como ele funciona!