Objetos

Os objetos são uteis para agrupar variáveis, de vários tipos de dados, relacionadas entre si, numa só identidade. Por exemplo, consideremos os alunos de uma escola. As variáveis nome, morada e idade estão relacionadas entre si porque são características ou propriedades de cada aluno. Logo, faz sentido criar um objeto aluno, que representa cada um dos alunos da escola, com as propriedades nome, morada e idade.

Criação de objetos

Os objetos em Javascript podem ser criados de 3 maneiras:

• Através de literal de objeto.
• Como instância de Object.
• Usando uma função construtora

Literal de objeto

É talvez a forma mais comum de criar um objeto rapidamente.

Na sua forma mais simples podemos criar um objeto vazio da seguinte forma:

let aluno = {};

Podemos depois, atribuir ao objeto as suas propriedades e os seus métodos:

aluno.nome = "Xico"; 
aluno.morada = "Lisboa"; 
aluno.idade = 17; 
aluno.estuda = function(){ 
   console.log('Estou a estudar') 
} 

Outra forma de o fazer é definir as propriedades e os métodos na altura da criação do objeto:

let aluno = { 
   nome: 'Xico', 
   morada: 'Lisboa', 
   idade: 17, 
   estuda: function(){ 
      console.log('Estou a estudar'); 
   } 
};

Nesta situação definimos as propriedades e os seus valores no formato nome:valor, sendo cada propriedade definida por um par nome.valor, separada por vírgula (,).

Acedemos às propriedades e métodos através do ponto (.):

console.log("Nome: " + aluno.nome + ", Morada: " + aluno.morada 
+ ", Idade: " + aluno.idade); 

aluno.estuda(); 

Podemos igualmente aceder às propriedades de um objeto definindo o nome da propriedade entre parenteses retos:

aluno['nome']

Esta abordagem tem a vantagem de podermos aceder à propriedade através de uma variável:

let prop = 'nome'; 
console.log(aluno[prop]); 

Instancia de Object

let aluno = new Object();

Após criarmos o objeto atribuímos-lhe as propriedades e os métodos:

aluno.nome = "Xico"; 
aluno.morada = "Lisboa"; 
aluno.idade = 17; 
aluno.estuda = function(){ 
   console.log('Estou a estudar') 
} 

Podemos depois aceder às propriedades e aos métodos do objeto:

console.log("Nome: " + aluno.nome + ", Morada: " + aluno.morada 
+ ", Idade: " + aluno.idade); 

aluno.estuda(); 

Função construtora

Uma função construtora é uma função normal que é instanciada usando a instrução new:

function Gato(){ 
} 

var gato = new Gato(); 

No exemplo anterior criámos uma função Gato() que depois instanciámos, criando um objeto na variável gato.

this

Se usarmos a palavra reservada this na função, ela irá pertencer ao objeto que será criado pela instrução new. Logo podemos usar a palavra reservada this na função para guardar os argumentos para ela passados:

function Gato(nome, idade){ 
   this.nome = nome; 
   this.idade = idade; 
}

Com isto, uma função construtora tem um papel semelhante ao das classes em linguagens como o Java, por exemplo:

function Gato(nome, idade){ 
   this.nome = nome; 
   this.idade = idade; 
}
 
var gato = new Gato('pantufas', 4); 
console.log(gato.nome + ', ' + gato.idade); 

O output será: pantufas, 4

Percorrer as propriedades de um objeto

Podemos percorrer as propriedades de um objeto usando a instrução for…in:

let aluno = { 
   nome: 'Xico', 
   morada: 'Lisboa', 
   idade: 17, 
}; 

for(p in aluno){ 
   console.log(  aluno[p] ); 
}  

O output será:

Xico
Lisboa
17

Desestruturação de um objeto

Consideremos o objeto seguinte:

const carro = { 
   marca: 'Opel', 
   modelo: 'Corsa', 
   matricula: '01-02-bb' 
};
const marca = carro.marca; 
const modelo = carro.modelo; 
const matricula = carro.matricula; 
console.log(marca + ", " + modelo + ", " + matricula);

Este código tem um problema porque nos obriga a repetir a expressão carro. 3 vezes para podermos extrair as propriedades do objeto.

Para obviar isso, o javascript ES6 introduziu uma funcionalidade chamada object destructuring ou desestruturação de objetos.

Esta funcionalidade permite-nos extrair as propriedades de um objeto numa única instrução, da seguinte maneira:

const {marca, modelo, matricula} = carro;

O código completo já com object destructuring ficara assim:

const carro = { 
   marca: 'Opel', 
   modelo: 'Corsa', 
   matricula: '01-02-bb' 
};

//Object destructuring:
const {marca, modelo, matricula} = carro; 

console.log(marca + ", " + modelo + ", " + matricula); 

Neste exemplo, extraímos todas as propriedades do objeto carro. No entanto, podemos extrair as propriedades que quisermos:

const {marca} = carro;

Neste caso, extraímos somente a propriedade marca.

Podemos igualmente extrair uma ou mais propriedades e renomeá-las, atribuindo-lhes um alias:

const {marca: m} = carro; 

console.log(m); 

Podemos também extrair objetos dentro de objetos:

const carro = { 
   marca: "Opel", 
   modelo: "Corsa", 
   matricula: "01-02-bb", 
   combustivel: { 
      tipo: "gasoleo", 
      categoria: "aditivado", 
   }, 
};
 
const { combustivel } = carro; 

console.log(combustivel.tipo);