Objetos em Java Script

Em JavaScript um objeto é uma coleção de propriedades, e uma propriedade é uma associação entre um nome e um valor (chave e valor). Neste post veja objetos em Java Script.

Objetos em JavaScript, exatamente como em muitas outras linguagens de programação, podem ser comparados com objetos na vida real.

O conceito de objetos em JavaScript pode ser entendido com objetos tangíveis da vida real.

Um objeto é uma a entidade independente, com propriedades e tipo. Compare-o com uma xícara, por exemplo.

Uma xícara é um objeto, com propriedades. Uma xícara tem uma cor, uma forma, peso, um material de composição, etc.

Da mesma forma, objetos em JavaScript podem ter propriedades, que definem suas características.

Um objeto em JavaScript tem propriedades associadas a ele. Uma propriedade de um objeto pode ser explicada como uma variável que é ligada ao objeto.

Propriedades de objetos são basicamente as mesmas que variáveis normais em JavaScript, exceto pelo fato de estarem ligadas a objetos.

As propriedades de um objeto definem as características do objeto. Você acessa as propriedades de um objeto com uma simples notação de ponto:

nomeDoObjeto.nomeDaPropriedade

Como as variáveis em JavaScript, o nome do objeto (que poderia ser uma variável normal) e um nome de propriedade diferem em maiúsculas/minúsculas (por exemplo, cor e Cor são propriedades diferentes).

Você pode definir uma propriedade atribuindo um valor a ela. Por exemplo, vamos criar um objeto chamado meuCarro e dar a ele propriedades chamadas marca, modelo, e ano, conforme mostrado a seguir:

 const veiculo = new Object();
 veiculo.fabricante = 'Chevrolet';
 veiculo.modelo = 'Celta';
 veiculo.ano = 2011; 

Propriedades de objetos em JavaScript podem também ser acessada ou alterada usando-se notação de colchete.

Objetos são às vezes chamados de arrays associativos, uma vez que cada propriedade é associada com um valor de string que pode ser usado para acessá-la.

Por exemplo, você poderia acessar as propriedades do objeto meuCarro como a seguir:

 veiculo['fabricante'] = 'Chevrolet';
 veiculo['modelo'] = 'Celta';
 veiculo['ano'] = 2011;
 
 console.log(veiculo)
  
 Saída: { fabricante: 'Chevrolet', modelo: 'Celta', ano: 2011 }

Para excluir um atributo basta utilizar delete:

 delete veiculo['fabricante']
 
 //ou
 
 delete veiculo.fabricante

Um nome de propriedade de um objeto pode ser qualquer string JavaScript válida, ou qualquer coisa que pode ser convertida em uma string, incluindo a string vazia.

No entanto, qualquer nome e propriedade que não é um identificador JavaScript válido (por exemplo, um nome de propriedade que tem um espaço ou um hífen, ou que começa com um número) só pode ser acessado(a) usando-se a notação de colchetes.

Essa notação é também muito útil quando nomes de propriedades devem ser determinados dinamicamente (quando o nome da propriedade não é determinado até o momento de execução). Exemplos:

 var meuObj = new Object(),
 str = "minhaString",
 aleat = Math.random(),
 obj = new Object();

 meuObj.tipo = "Sintaxe de ponto";
 meuObj["data de criacao"] = "String com espaco";
 meuObj[str] = "valor de String";
 meuObj[aleat] = "Numero Aleatorio";
 meuObj[obj] = "Objeto";
 meuObj[""] = "Mesmo uma string vazia";
 console.log(meuObj);

Você pode também acessar propriedades usando um valor de string que está armazenado em uma variável:

 var nomeDaPropriedade = "marca";
 meuCarro[nomeDaPropriedade] = "Volkswagen";
 nomeDaPropriedade = "modelo";
 myCar[nomeDaPropriedade] = "Fox";

Você pode usar a notação de colchetes com o comando for…in para iterar por todas as propriedades enumeráveis de um objeto.

Para ilustrar como isso funciona, a seguinte função mostra as propriedades de um objeto quando você passa o objeto e o nome do objeto como argumentos para a função:

 function mostrarProps(obj, nomeDoObj) {
  var resultado = "";
  for (var i in obj) {
    if (obj.hasOwnProperty(i)) {
        resultado += nomeDoObj + "." + i + " = " + obj[i] + "\n";
    }
  }
  return resultado;
 }

Então a chamada de função mostrarProps(myCar, “myCar”) retornaria o seguinte:

meuCarro.make = Volkswagen
meuCarro.modelo = Fox
meuCarro.ano = 2007

É possível criar um objeto dentro da declaração do mesmo:

 const produto = {
   nome: 'Computador',
   preco: 1250
}  

Um objeto armazenado em uma constante pode ter seu valor alterado. Isso é possível porque o objeto aponta para o endereço de memória onde a informação está armazenada:

 const pessoa = { nome: 'Benedito' } //Objeto criado
 pessoa.nome = 'Aline'//Valor alterado mantendo o mesmo endereço de memória

Agora se o endereço de memória do objeto for alterado, um erro será gerado:

 const pessoa = { nome: 'Benedito' } //Objeto criado
 pessoa = { nome: 'Maria' } //Objeto criado em outro endereço de memória

Caso queira impedir que um objeto seja adicionado, alterado ou deletado utilize o método freeze:

 const pessoa = { nome: 'Benedito' }
 Object.freeze(pessoa)
 pessoa.nome = 'Aline'
 
 console.log(pessoa.nome) //Será mostrado 'Benedito', pois o objeto foi "congelado"
 
 const objetoConstante = Object.freeze({ nome: 'Maria' })//Objeto criado que será imutável

Também é possível criar uma estrutura aninhada de objetos dentro de objetos:

 const produto = {
   nome: 'Computador',
   preco: 1250,
   caracteristicas: {
      cor: 'azul',
      qtde: 50
   }
}  

É possível criar um objeto para armazenar funções:

 const obj = {
    funcao1: function() { //forma antiga
    //...
    },
    funcao2() { //forma nova
    //...
    }
  }

É possível criar um array de objetos:

 clientes: [{
    nome: Aline,
    idade: 36
 }, {
    nome:  Bene,
    idade: 39 
 }]

JavaScript é uma linguagem muito dinâmica e flexível. Com ela é possível criar, alterar e excluir atributos de objetos facilmente.

No entanto nem sempre essa flexibilidade é vantajosa. Em alguns casos será preciso impedir a criação/exclusão de atributos em objetos:

Para impedir a criação de novos atributos em um objeto:

  const produto = Object.preventExtensions({
     descricao='Videogame', preco:2100, desc: 0.15
  })
  
   //Teste para mostrar se é extensível ou não. Retornará 'false'
   console.log('É extensível? ', Object.isExtensible(produto)) 
   
   produto.nome = 'Smartfone' //atributo alterado (permitido)
   produto.qtde = 100 //atributo acrescentado (não permitido)
   delete produto.desc //atributo excluído (permitido)

Também é possível selar objetos, ou seja, impedir a criação e exclusão de atributos:

 const pessoa = { nome: 'Fernanda', idade: 40 }
 Object.seal(pessoa) //sela objeto

 //Teste para mostrar se está selado ou não. Retornará 'true'
 console.log('Está selado? ', Object.isSealed(produto)) 
   
 pessoa.nome = 'Osvaldo' //atributo alterado (permitido)
 pessoa.sexo = 'Masculino' //atributo criado (não permitido)
 delete pessoa.idade //atributo excluído (não permitido)

Para selar um objeto, bem como impedir a inclusão de novos valores, exclusão de chaves do objeto, modificações dos dados das variáveis (deixá-lo completamente constante), utilizamos Object.freeze.

Operador Rest/Spread em Java Script

Dúvidas ou sugestões? Deixem nos comentários! Para mais dicas, acesse o nosso canal no YouTube:
https://youtube.com/criandobits