Compreendendo os acessadores de propriedade em JavaScript

Em JavaScript, acessadores de propriedade são mecanismos que permitem acessar as propriedades de um objeto. Existem duas maneiras principais de fazer isso: notação de ponto e notação de colchetes.

Notação de ponto

A notação de ponto é a forma mais comum de acessar propriedades. Você simplesmente usa um ponto (.) seguido do nome da propriedade.

Notação de colchetes

A notação de colchetes é útil quando o nome da propriedade é dinâmico ou não é um identificador válido (por exemplo, contém espaços ou caracteres especiais). Você usa colchetes ([]) e passa o nome da propriedade como uma string

Criando objetos em JavaScript

A linguagem fornece sintaxe conhecida como notação literal de objeto para criar objetos rapidamente. Literais de objeto são denotados por chaves. O exemplo a seguir cria um objeto vazio sem propriedades.

var animal = {};

Dentro das chaves, as propriedades e seus valores são especificados como uma lista de pares chave/valor.
As chaves podem ser strings ou identificadores, enquanto os valores podem ser qualquer expressão válida. A lista de pares chave/valor é delimitada por vírgulas, com cada chave e valor separados por dois pontos.

O exemplo a seguir cria um objeto com três propriedades usando notação literal.

A primeira propriedade, animal, detém o número um.
A segunda propriedade, dolphin, é especificada usando uma string e também armazena um valor de string. A terceira propriedade, mamífero, armazena um objeto vazio.

var animal = {
  dolphin: 1,
  "swim": "some string",
  mammal: {
  }
};

Cada propriedade foi escrita em uma linha separada e recuada. O objeto inteiro poderia ter sido escrito em uma única linha, mas o código é mais legível neste formato. Isto é especialmente verdadeiro para objetos com muitas propriedades ou objetos aninhados.

JavaScript fornece duas notações para acessar propriedades de objetos.

A primeira e mais comum é conhecida como notação de ponto.
Na notação de ponto, uma propriedade é acessada fornecendo o nome do objeto host, seguido por um ponto (ou ponto), seguido pelo nome da propriedade.

Notação de ponto

A notação de ponto é a forma mais comum de acessar propriedades. Você simplesmente usa um ponto (.) seguido do nome da propriedade. Por exemplo:

O exemplo a seguir mostra como a notação de ponto é usada para ler e gravar em uma propriedade. Se objeto.dolphin
inicialmente manteve o valor um, então seu valor se tornaria dois após a execução desta instrução.

• Observe que se animal.dolphon ainda não tivesse um valor, então seria indefinido.

animal.dolphin = animal.dolphin   1;

A sintaxe para acessar as propriedades do objeto é conhecida como notação de colchetes. Em notação de colchetes, o nome do objeto é seguido por um conjunto de colchetes.
Dentro de colchetes, o nome da propriedade é especificado como uma string.
O exemplo anterior de notação de ponto foi reescrito abaixo para usar a notação de colchetes. Embora o código possa parecer diferente, ele é funcionalmente equivalente ao exemplo anterior.

object["dolphin"] = object["dolphin"]   1;

Notação de colchetes é mais expressiva que notação de ponto porque permite que uma variável especifique todo ou parte do nome da propriedade.
Isso é possível porque o interpretador JavaScript converte automaticamente a expressão entre colchetes em uma string e, em seguida, recupera a propriedade correspondente.

O exemplo a seguir mostra como nomes de propriedades podem ser criados dinamicamente usando notação de colchetes. No exemplo, o nome da propriedade foo é criado concatenando o conteúdo da variável d, com a string "dolphin".

var d = "d";

object[d   "dolphin"] = "bar";

Notação de colchetes também permite que nomes de propriedades contenham caracteres que são proibidos em notação de ponto.
Por exemplo, a seguinte declaração é completamente legal entre colchetes. No entanto, se você tentasse criar o mesmo nome de propriedade em notação de ponto, encontraria um erro de sintaxe.

object["!@#$%^&*()."] = true;

Acessando propriedades aninhadas

Propriedades de objetos aninhados podem ser acessadas encadeando referências de pontos e/ou colchetes.
Por exemplo, o objeto a seguir contém um objeto aninhado chamado golfinho, que contém outro objeto chamado mamífero, que possui uma propriedade chamada anos que contém o valor um.

var animal = {
  dolphin: {
    mammal: {
      years: 1
    }
  }
};

As expressões a seguir acessam a propriedade aninhada, anos. A primeira expressão usa notação de ponto, enquanto a segunda expressão usa notação de colchetes.
A terceira expressão combina ambas as notações para obter o mesmo resultado.

animal.dolphin.mammal.lungs;
animal["dolphin"]["mammal"]["years"];
animal["dolphin"].mammal["years"];

Expressões como as mostradas no exemplo anterior podem prejudicar o desempenho se usadas incorretamente.
Avaliar cada expressão de ponto ou colchete leva tempo.

Se a mesma propriedade for usada várias vezes, faz mais sentido acessar a propriedade uma vez e armazenar o valor em uma variável local para todos os usos futuros. O exemplo a seguir usa bar muitas vezes em um loop. No entanto, em vez de perder tempo calculando o mesmo valor repetidamente, bar é armazenado em uma variável local.

var years = animal.dolphin.mammal.years;
var count = 0;

for (var i = 0; i 




  
  
  Funções como métodos


Quando uma função é usada como propriedade de um objeto, ela é chamada de método. Assim como as propriedades, os métodos também podem ser especificados em notação literal de objeto. O exemplo a seguir mostra como isso é feito.


var animal = {
  sum: function(dolphin, years) {
    return dolphin   years;
  }
};




Métodos também podem ser invocados usando notação de ponto e colchete. 

O exemplo a seguir invoca o método sum() do exemplo anterior usando ambas as notações.


dolphin.sum(1, 2);
dolphin["sum"](1, 2);






  
  
  Adicionando propriedades e métodos


Notação literal de objeto é útil para criar novos objetos, mas não pode adicionar propriedades ou métodos a objetos existentes.

 Felizmente, adicionar novos dados a um objeto é tão simples quanto criar uma instrução de atribuição. 

O exemplo a seguir cria um objeto vazio. 

Duas propriedades, golfinho e mamífero, e um método, anos, são então adicionadas usando instruções de atribuição. 

Observe que este exemplo usa notação de ponto, mas notação de colchetes também funcionaria igualmente.


var animal = {};
animal.dolphin = 1;
animal.mammal = null;
animal.years = function() {
  return "I am 5 years()";
};




Resumo

Objetos são tipos de dados compostos construídos a partir de primitivos e outros objetos. Os blocos de construção de um objeto são comumente chamados de campos ou propriedades. Propriedades são usadas para descrever algum aspecto de um objeto. Por exemplo, uma propriedade pode descrever o comprimento de uma lista, a cor de um cachorro ou a data de nascimento de uma pessoa.

Portanto, a sintaxe do objeto do JavaScript é crucial para ser entendida, pois serve como base da linguagem.

Primeiro você precisa entender os objetos antes de entender a programação orientada a objetos.

• Notação de ponto: use quando nomes de propriedades são identificadores válidos.
• Notação de colchetes: use quando os nomes das propriedades são identificadores dinâmicos ou inválidos. Esses acessadores são fundamentais em JavaScript para manipular objetos e suas propriedades de maneira eficaz.

Boa codificação!