DEV Community

Cover image for Conhecendo objetos em JavaScript
Neilton Seguins
Neilton Seguins

Posted on

3

Conhecendo objetos em JavaScript

Você já se deparou com a necessidade de guardar um conjunto de informações complexas em seu código JavaScript? Por exemplo, você precisa armazenar dados de um usuário em um banco de dados, como nome, idade e endereço. Que estrutura do JavaScript você usaria para esta missão?

Neste artigo, vamos conhecer como os objetos podem ser úteis em tarefas como essa e entender o que é essa importante coleção de dados no JavaScript.

Vem comigo!

Um "armário" para seus dados

Pensa no armário da sua casa. Se você for organizado, cada gaveta vai servir para guardar algum tipo de item da sua casa, como chaves, ferramentas, remédios, etc. Se pensarmos em objetos no JavaScript, cada gaveta representa uma propriedade (chave) e o conteúdo dentro dela, o valor associado a essa propriedade. Na gaveta de chaves você terá as chaves do seu carro, casa, moto. E na gaveta de ferramentas você poderá guardar uma chave inglesa, martelo, furadeira, etc.

Os objetos armazenam informações organizadas em pares chave-valor. Exemplo:

const usuario = {
  nome: "Ana",
  idade: 25,
  cidade: "São Paulo"
};
Enter fullscreen mode Exit fullscreen mode

Nesse exemplo, usuario é um objeto que guarda informações sobre um usuário. As chaves são nome, idade e cidade, e os valores correspondentes são "Ana", 25 e "São Paulo".

Acessando as informações do objeto

Para acessar uma propriedade do objeto, você utiliza a notação de ponto (.) ou colchetes ([]):

console.log(usuario.nome); // Saída: Ana
console.log(usuario["idade"]); // Saída: 25
Enter fullscreen mode Exit fullscreen mode

A notação de colchetes é útil quando você precisa acessar uma propriedade cujo nome é armazenado em uma variável:

const propriedade = "cidade";
console.log(usuario[propriedade]); // Saída: São Paulo
Enter fullscreen mode Exit fullscreen mode

Adicionando e modificando propriedades

Você pode adicionar novas propriedades a um objeto ou modificar o valor de uma propriedade existente:

usuario.profissao = "Desenvolvedora"; // Adiciona uma nova propriedade
usuario.idade = 26; // Modifica o valor da propriedade 'idade'
Enter fullscreen mode Exit fullscreen mode

Objetos e arrays: trabalhando em conjunto

Objetos podem conter arrays como valores de suas propriedades, permitindo que você organize dados relacionados de forma eficiente:

const usuario = {
  nome: "João",
  idades: [20, 21, 22, 23] // Armazena as idades do João ao longo dos anos
};

console.log(usuario.idades[1]); // Saída: 21
Enter fullscreen mode Exit fullscreen mode

Agora que você já conhece objetos no JavaScript, tenho certeza que conseguirá trabalhar melhor com as coleções de dados em suas aplicações. Por exemplo, se você precisa de informações de um usuário que preenche um formulário, objetos podem armazenar esses dados em uma única coleção.

Explore a documentação oficial do JavaScript para aprofundar seus conhecimentos sobre objetos e descobrir suas infinitas possibilidades.

Já sabia que era possível fazer isso com objetos? Este artigo te ajudou de alguma forma, deixe seu comentário para que eu possa saber o que você achou.

Imagem gerada por IA: https://designer.microsoft.com/image-creator
Prompt:

Uma ilustração plana de uma mulher negra com um um moletom azul e uma xícara de café em uma quarto escuros com luzes de led neon na cor rosa com um computador gamer, programando algum código em cores macias e pastel.

Sentry blog image

How to reduce TTFB

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

In this article, we’ll see how we can identify what makes our TTFB high so we can fix it.

Read more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay