Capítulo 4Javascript Objetos

Aulas em Vídeo

Parte 1/1

Objetos

Tipos primitivos de dados são chamados PRIMITIVOS pois seus valores correspondem a somente dois tipos: números e/ou strings

Objetos , por sua vez, podem armazenar dados mais complexos

Abaixo um exemplo de como podemos criar e acessar um objeto.


let carro = {
  marca: 'Fiat',
  modelo: 'Uno'
}
console.log(carro.modelo)
console.log(carro['marca'])

RESULTADO

Listando todas as propriedades de um objeto.


let carro = {
  marca: 'Fiat',
  modelo: 'Uno',
  ano: 2000
}

for (let key in carro){
  console.log(key) //marca, modelo, ano
  console.log(carro[key]) // Fiat, Uno, 2000
}

RESULTADO

Armazenamento em memória

quando copiamos uma variável cujo conteúdo é um tipo primitivo, teremos como resultado duas variáveis independentes com conteúdos idênticos, porém distintos.

quando copiamos uma variável cujo conteúdo é um objeto, teremos como resultados duas variáveis distintas apontando para o mesmo objeto.

nesse caso: o que é copiado é a referência ao objeto.

Dois objetos somente serão iguais se suas referências forem idênticas.


let cliente = {};   
let cliente2 = cliente;
console.log(cliente == cliente2)
let carro = {};
let carro2 = {};
console.log(carro == carro2)

RESULTADO

Clonagem de objetos


 let cliente = {
    nome: 'José Alberto',
    idade: 22
};   
//clonagem
let clienteNovo = {} // cria um objeto
for(let key in cliente){ //copia todas as propriedades ...
    clienteNovo[key] = cliente[key]
}
//listando propriedades e valores de cliente
for(let key in cliente){ console.log(`${key}: ${cliente[key]}`)}
//listando propriedades e valores de cliente
for(let key in clienteNovo){ console.log(`${key}: ${clienteNovo[key]}`)}
//cliente e clienteNovo são objetos distintos
console.log(cliente == clienteNovo)

RESULTADO

função construtora


 function Carro(marca, modelo, ano){
    this.marca = marca
    this.modelo = modelo
    this.ano = ano
}

let carro1 = new Carro('Fiat', 'Uno', '2001')
for(let key in carro1){
    console.log(`${key}: ${carro1[key]}`)
}

RESULTADO

A palavra-chave this é responsável por iniciar o objeto adequadamente

A criação de um objeto, ou seja, a instanciação de uma classe é realizada com uso do operador new. Após este operador vem o nome da função construtora, responsável pela inicialização do objeto.

Criação de métodos

há duas formas para criarmos um método dentro de um objeto

1) Criação de métodos utilizando prototype que é um recurso do Javascript que possibilita modificar uma classe depois de que ela foi criada


 //definição de um objeto
function Carro(marca, modelo, ano){
    this.marca = marca
    this.modelo = modelo
    this.ano = ano
    this.status = 'desligado'
}

//criação do método
Carro.prototype.ligar = function() {
  this.status = 'ligado';
  console.log(`O carro está: ${this.status}`)
}

//instanciando e utilizando o objeto
Carro1 = new Carro();
Carro1.ligar()

RESULTADO

2) Criação de métodos dentro do próprio objeto


 //definição de um objeto
function Carro(marca, modelo, ano){
    this.marca = marca
    this.modelo = modelo
    this.ano = ano
    this.status = 'desligado'

    //criação do método
    this.ligar = function() {
      this.status = 'ligado';
      console.log(`O carro está: ${this.status}`)
    }

}


//instanciando e utilizando o objeto
Carro1 = new Carro();
Carro1.ligar()

RESULTADO

Garbage Collection

Garbage Collection é uma forma de gerenciamento automático de memória. O coletor tenta eliminar objetos que não estão mais em uso pelo sistema.

Palavra chave 'this'

this = contexto de onde uma função é executada

assim o valor de this
irá depender de como a função foi invocada

1) quando a função é uma chamada simples


function teste() {
    return this
}
console.log(teste())

RESULTADO

A função está dentro do escopo global. Por padrão, this será o objeto global window, que representa a janela do navegador

2) quando a função é um método de um objeto


let carro = {
  marca: 'Fiat',
  modelo: 'Uno',
  exibe(){
  	console.log("sou o carro: " + this.marca + "-" + this.modelo)
  }
} 
carro.exibe();

RESULTADO

Quando uma função representa um método de um objeto, o valor do this passa a ser o próprio objeto

3) quando a função é um construtor de um objeto


function Carro(marca, modelo) {
    this.marca = marca
    this.modelo = modelo
    this.exibir = function() {
        console.log(`${this.marca} - ${this.modelo}`)
    }
}

let carroNovo = new Carro('Ford', 'Ka')
carroNovo.exibir()

RESULTADO

Quando uma função representa um construtor de um objeto, o valor do this passa a ser o contexto do próprio objeto