♫ in the jungle, the mighty jungle, the lion sleeps tonight ♫
O que são objetos?
Objetos são um conjunto de propriedades atribuídas à uma variável. Elas podem representar objetos da vida real.
Como são utilizados os objetos?
A sintaxe para a criação de um objeto é o seguinte:
Javascript:
let variavel = {
chave1: valor1,
chave2: valor2,
chave3: valor3,
...
chaveN: valorN
};
A declaração de um objeto é feita abrindo chaves
{}
e inserindo as propriedades entre elas. O padrão de uma propriedade é uma chave seguido do seu valor. A chave
é a sua identificação, seu nome. O valor, é como uma chave é representada.Veja um exemplo de um objeto a seguir:
Javascript:
const usuario = {
nome: "Josivaldo",
sobrenome: "Eliardes da Silva",
idade: 25,
estadoCivil: "Casado"
};
Na variável
usuario
, é declarado um objeto com as propriedades nome
, sobrenome
, idade
e estadoCivil
.Para acessar as propriedades desse objeto, use a seguinte sintaxe:
Javascript:
// Método 1
usuario.nome;
// Método 2
usuario["nome"];
// Exemplos
console.log(usuario.nome);
console.log(usuario["idade"] + 5);
// Saída:
// "Josivaldo"
// 30
Conforme mostrado acima, primeiro refere-se o nome da variável que contém o objeto e depois o nome da propriedade do objeto seguido de um
.
ponto.Há uma alternativa para acessar uma propriedade, nesse caso, seria primeiro referir-se à variável do objeto e sua propriedade numa string/texto entre colchetes
["propriedade"]
, semelhante a como é referido um valor dentro de um array, só que ao invés de indicar da posição, é passado um nome.Acessar a propriedade
sobrenome
no objeto da variável usuario
é usar usuario.sobrenome
ou usuario["sobrenome"]
.Adicionando propriedades à um objeto existente
É possível adicionar propriedades à objetos que já foram declarados antes desde que esses objetos não sejam declarados em variáveis constantes (declarados pela palavra-chave
const
).
Javascript:
let carro = {
marca: "Fiat",
anoFabricacao: 2020
};
carro.cor = "Vermelho";
console.log(carro.marca);
console.log(carro.cor);
// Saída:
// "Fiat"
// "Vermelho"
Qualquer nome de uma propriedade que não exista em um objeto, é retornado
undefined
. Veja um exemplo:
Javascript:
const pessoa = {
nome: "Márcia",
sobrenome: "Ribeiro"
};
console.log(pessoa.nomeCompleto);
// Saída: undefined
Acessando propriedades na declaração do próprio objeto
Durante a declaração do objeto, as vezes é necessário unir informações importantes a partir de duas ou mais propriedades do mesmo objeto a fim de realizar tarefas rápidas.
Utilizando o exemplo anterior, para obtermos o nome completo da forma convencional, teríamos o seguinte:
Javascript:
const pessoa = {
nome: "Márcia",
sobrenome: "Ribeiro"
};
console.log(pessoa.nome + " " + pessoa.sobrenome);
// Saída: "Márcia Ribeiro"
No exemplo acima, fazemos a concatenação (junção) de duas strings para formar o nome completo.
Se fossemos depender disso, teríamos que utilizar desse método várias vezes e não seria uma prática boa de programação se você considerar que esse objeto poderia ser acessado por vários outros arquivos e, para cada arquivo, teria que realizar essa união de strings todas as vezes.
Para resolver esse problema, utilizaremos a palavra-chave
this
dentro da declaração do objeto quando nós formos nos referir à uma propriedade do próprio objeto. Veja o exemplo abaixo:
Javascript:
const pessoa = {
nome: "Márcia",
sobrenome: "Ribeiro",
nomeCompleto: function () {
return this.nome + " " this.sobrenome;
}
};
console.log(pessoa.nomeCompleto());
// Saída: "Márcia Ribeiro"
No objeto do exemplo acima, foi criado uma propriedade
nomeCompleto
onde é atribuído uma função que retorna a junção de duas propriedades do objeto: o nome
e o sobrenome
.Na atribuição, foi utilizado
function() {}
para declarar uma função pois é através dele que podemos utilizar a palavra-chave this
para podermos nos referir ao objeto que está sendo criado. O this
vem antes da propriedade desejada e são interligados por um .
ponto entre eles, formando this.nome
e this.sobrenome
.E como se trata de uma função, para que extraiamos algum valor dele, utilizamos a palavra-chave
return
antes do valor que queremos daquela função.Mais informações:
Última edição: