Erro de acesso à propriedade de objeto em JavaScript

Ao acessar uma propriedade de um objeto, o nome dessa propriedade não pode ser armazenado em uma variável. Vamos ver por quê. Suponha que temos o seguinte objeto:

javascriptlet obj = {a: 1, b: 2, c: 3};

Suponha que uma variável armazene o nome da propriedade cujo valor queremos obter:

javascriptlet key = 'a';

Vamos tentar acessar a propriedade do objeto usando essa variável:

javascriptconsole.log(obj.key); // undefined

O código acima não funcionará, porque, na verdade, estamos procurando uma propriedade com o nome 'key', e não a propriedade cujo nome está armazenado na variável key. Ou seja, na prática, nosso código é equivalente ao seguinte:

javascriptconsole.log(obj['key']);

A única maneira de acessar um elemento por uma chave de uma variável é escrevendo essa variável entre colchetes:

javascriptconsole.log(obj[key]);

javascriptlet obj = {x: 1, y: 2, z: 3};

let prop = 'x';
console.log(obj.prop);

javascriptlet obj = {x: 1, y: 2, z: 3};

let prop = 'x';
console.log(obj['prop']);