Javascript

Objetos: estruturando dados do mundo real Já leu

• • 7 min de leitura

Objetos: estruturando dados do mundo real
Arrays são ótimos para listas. Mas como representar uma pessoa, um produto, um pedido — entidades com várias característi

Arrays são ótimos para listas. Mas como representar uma pessoa, um produto, um pedido — entidades com várias características diferentes? Para isso existem os objetos.

Um objeto é uma coleção de propriedades, onde cada propriedade tem um nome (chave) e um valor. É a estrutura de dados mais fundamental do JavaScript — tanto que a linguagem inteira foi construída em cima dela. Arrays são objetos. Funções são objetos. O próprio document do navegador é um objeto.

Entender objetos profundamente é entender o JavaScript.

Criando objetos

const pessoa = {
  nome: "Ana Paula",
  idade: 28,
  profissao: "Desenvolvedora",
  ativa: true,
};

A sintaxe usa chaves {}, com pares de chave: valor separados por vírgula. Isso se chama objeto literal — a forma mais comum de criar objetos.

Acessando propriedades

Há duas formas de acessar valores:

const pessoa = {
  nome: "Ana Paula",
  idade: 28,
  profissao: "Desenvolvedora",
};

// Notação de ponto (use sempre que possível)
console.log(pessoa.nome);      // Ana Paula
console.log(pessoa.idade);     // 28

// Notação de colchetes (use quando a chave é dinâmica)
const campo = "profissao";
console.log(pessoa[campo]);    // Desenvolvedora
console.log(pessoa["nome"]);   // Ana Paula

A notação de colchetes é essencial quando você não sabe o nome da propriedade antecipadamente — quando ela vem de uma variável, por exemplo.

Modificando e adicionando propriedades

const produto = {
  nome: "Notebook",
  preco: 3500,
};

// Modificar propriedade existente
produto.preco = 3200;
console.log(produto.preco); // 3200

// Adicionar nova propriedade
produto.estoque = 15;
console.log(produto.estoque); // 15

// Remover propriedade
delete produto.estoque;
console.log(produto.estoque); // undefined

Propriedades com funções — métodos

Quando uma propriedade de um objeto é uma função, ela é chamada de método:

const calculadora = {
  somar: function(a, b) {
    return a + b;
  },
  subtrair: function(a, b) {
    return a - b;
  },
  // Sintaxe moderna de método (shorthand):
  multiplicar(a, b) {
    return a * b;
  },
};

console.log(calculadora.somar(5, 3));       // 8
console.log(calculadora.subtrair(10, 4));   // 6
console.log(calculadora.multiplicar(3, 7)); // 21

A palavra-chave this

Dentro de um método, this se refere ao próprio objeto. É como o objeto falando de si mesmo:

const conta = {
  titular: "Carlos",
  saldo: 1000,

  depositar(valor) {
    this.saldo += valor;
    console.log(`Depósito de R$ ${valor}. Novo saldo: R$ ${this.saldo}`);
  },

  sacar(valor) {
    if (valor > this.saldo) {
      console.log("Saldo insuficiente.");
      return;
    }
    this.saldo -= valor;
    console.log(`Saque de R$ ${valor}. Novo saldo: R$ ${this.saldo}`);
  },

  verSaldo() {
    console.log(`${this.titular}, seu saldo é R$ ${this.saldo}`);
  },
};

conta.verSaldo();    // Carlos, seu saldo é R$ 1000
conta.depositar(500); // Depósito de R$ 500. Novo saldo: R$ 1500
conta.sacar(200);     // Saque de R$ 200. Novo saldo: R$ 1300
conta.sacar(2000);    // Saldo insuficiente.

Atenção: this dentro de arrow functions não se refere ao objeto — por isso usamos a sintaxe de função normal nos métodos. Voltaremos a este tema no Artigo 08.

Objetos aninhados

Propriedades de um objeto podem ser outros objetos:

const usuario = {
  nome: "Fernanda",
  idade: 31,
  endereco: {
    rua: "Av. Paulista",
    numero: 1000,
    cidade: "São Paulo",
    estado: "SP",
  },
  contato: {
    email: "fernanda@email.com",
    telefone: "11 99999-0000",
  },
};

console.log(usuario.endereco.cidade);    // São Paulo
console.log(usuario.contato.email);      // fernanda@email.com
console.log(usuario.endereco.numero);    // 1000

Arrays de objetos — o padrão mais comum

Na prática, você vai trabalhar o tempo todo com listas de objetos:

const produtos = [
  { id: 1, nome: "Notebook", preco: 3500, categoria: "eletrônicos" },
  { id: 2, nome: "Mouse", preco: 80, categoria: "eletrônicos" },
  { id: 3, nome: "Cadeira", preco: 900, categoria: "móveis" },
  { id: 4, nome: "Mesa", preco: 700, categoria: "móveis" },
];

// Filtrar por categoria
const eletronicos = produtos.filter(p => p.categoria === "eletrônicos");
console.log(eletronicos);

// Encontrar produto por id
const produto = produtos.find(p => p.id === 3);
console.log(produto.nome); // Cadeira

// Listar nomes de todos os produtos
const nomes = produtos.map(p => p.nome);
console.log(nomes); // ["Notebook", "Mouse", "Cadeira", "Mesa"]

// Total do valor em estoque
const total = produtos.reduce((acc, p) => acc + p.preco, 0);
console.log(`Total: R$ ${total}`); // Total: R$ 5180

Viu como map, filter e reduce do artigo anterior se encaixam perfeitamente aqui?

Verificando se uma propriedade existe

const usuario = { nome: "João", idade: 25 };

// Operador in
console.log("nome" in usuario);    // true
console.log("email" in usuario);   // false

// Optional chaining — evita erros ao acessar propriedades aninhadas
const config = {
  tema: {
    cor: "azul",
  },
};

console.log(config.tema?.cor);       // "azul"
console.log(config.idioma?.codigo);  // undefined (sem erro!)
// Sem o ?. isso causaria: TypeError: Cannot read properties of undefined

O optional chaining (?.) é um dos recursos mais úteis do JavaScript moderno. Use-o sempre que acessar propriedades que podem não existir.

Iterando sobre objetos

const pessoa = {
  nome: "Ricardo",
  idade: 35,
  cidade: "Curitiba",
};

// for...in — percorre as chaves do objeto
for (const chave in pessoa) {
  console.log(`${chave}: ${pessoa[chave]}`);
}
// nome: Ricardo
// idade: 35
// cidade: Curitiba

// Object.keys — array com as chaves
console.log(Object.keys(pessoa));
// ["nome", "idade", "cidade"]

// Object.values — array com os valores
console.log(Object.values(pessoa));
// ["Ricardo", 35, "Curitiba"]

// Object.entries — array de pares [chave, valor]
console.log(Object.entries(pessoa));
// [["nome", "Ricardo"], ["idade", 35], ["cidade", "Curitiba"]]

Object.entries() é especialmente poderoso porque você pode encadear métodos de array sobre ele:

const precos = { notebook: 3500, mouse: 80, teclado: 200 };

// Filtrar itens acima de R$ 100 e exibir formatado
Object.entries(precos)
  .filter(([, valor]) => valor > 100)
  .forEach(([produto, valor]) => {
    console.log(`${produto}: R$ ${valor}`);
  });

// notebook: R$ 3500
// teclado: R$ 200

Copiando objetos

Objetos são passados por referência — isso é uma fonte clássica de bugs para iniciantes:

const original = { nome: "Ana", idade: 25 };

// ❌ Isso NÃO cria uma cópia — ambas apontam para o mesmo objeto
const copia = original;
copia.nome = "Maria";

console.log(original.nome); // "Maria" ← o original foi alterado!

Para copiar corretamente, use o spread operator:

const original = { nome: "Ana", idade: 25 };

// ✅ Cria uma cópia independente (shallow copy)
const copia = { ...original };
copia.nome = "Maria";

console.log(original.nome); // "Ana" ← intacto
console.log(copia.nome);    // "Maria"

Falaremos mais sobre spread operator no próximo artigo.

Tarefa para você

Modele um sistema simples de biblioteca:

// 1. Crie um array com pelo menos 4 livros
//    Cada livro deve ter: titulo, autor, ano, disponivel (boolean), paginas

// 2. Filtre apenas os livros disponíveis

// 3. Encontre todos os livros publicados após 2000

// 4. Exiba o título e autor de cada livro no formato:
//    "Dom Casmurro — Machado de Assis"

// 5. Calcule o total de páginas de todos os livros

// Dica: combine map, filter e reduce com seu array de objetos

Conclusão

Neste artigo você aprendeu:

  • Como criar objetos com a sintaxe literal
  • Acessar propriedades com ponto e colchetes
  • Adicionar, modificar e remover propriedades
  • Criar métodos e usar this
  • Trabalhar com objetos aninhados
  • Iterar sobre objetos com for...in e Object.keys/values/entries
  • O perigo da referência e como copiar objetos corretamente
  • O optional chaining ?. para acesso seguro

No próximo artigo vamos aprender desestruturação, spread e rest — recursos que deixam o código com objetos e arrays muito mais limpo e expressivo.

 

📚 Fontes e Referências

Comentários

Mais em Javascript

Mini Projeto: Calculadora no Console
Mini Projeto: Calculadora no Console

Chegamos ao fim do primeiro módulo. Em nove artigos você percorr...

Tratamento de erros em requisições HTTP
Tratamento de erros em requisições HTTP

Fazer uma requisição funcionar no ambiente de desenvolvimento é fácil. O verd...

Git avançado e fluxo de trabalho em equipe
Git avançado e fluxo de trabalho em equipe

Saber usar git add, git commit e git push é o mínimo. Em um projeto real com...