Destructuring em Java Script

Destructuring em Java Script é um recurso adicional de sintaxe que facilita o acesso a dados dentro de um objeto ou array e a criação de variáveis que contenham esses dados.

Esse recurso possibilita a construção de códigos mais curtos e claros:

 const pessoas = {
   nome: 'José',
   idade: 26,
   endereco: {
      logradouro: 'Rua da Sorte',
      numero: 215
 }    
 
 /* Utilizando o operador destructuring é possível retirar atributos de dentro de uma estrutura, 
 neste caso de um objeto: */
 
 const {nome, idade} = pessoa //"Tire" do objeto pessoa o nome e a idade
 console.log(nome, idade)  
 
 //Para extrair o endereço da outra estrutura:
 const { endereco: { logradouro, numero } } = pessoa

O código acima cria uma estrutura onde são armazenadas nome, idade e endereço de pessoas, e é feito uma desestruturação para retirar informações dos atributos da estrutura criada.

Também é possível criar variáveis para armazenar as informações extraidas da estrutura:

 ...
 const {nome: n, idade: i} = pessoa
 console.log(n, i)  

No exemplo abaixo foi desestruturado um array o qual foi preenchido com os valores 2, 4 e 10 e mostrado logo a seguir:

 const[n1, n2, n3] = [ 2, 4, 10]
 console.log(n1, n2, n3)

Também é possível utilizar o destructuring no âmbito das funções:

 //São passados valores padrão
 function rand({ min = 0, max = 800 }) {
   const val = Math.random() * (max - min) + min
   return Math.floor(valor)
 }

//Aqui criamos um objeto e definimos os valores para os parâmetros do mesmo
 const obj = { max: 70, min: 30 }
 console.log(rand(obj)) //Definimos o objeto como parâmetro para a função
 console.log(rand({ min: 100 } )) 

Funções em Java Script

Dúvidas ou sugestões? Deixem nos comentários! Para mais dicas, acesse o nosso canal no YouTube:
https://youtube.com/criandobits