diferença entre notação de ponto e notação de colchete em javascript

Eu estou tentando entender a diferença entre .Notation e [] notação. No meu problema abaixo quando eu uso if (object[key] === true) eu recebo a resposta correta. Quando eu uso if (object.key === true) não funciona. Alguém poderia explicar por que é diferente?

 var myObj = { one: false, two: false, three: false, four: true, five: false, six: false }; var myFunc = function (object) { for (var key in object) { if (object[key] === true) { return "There is a true value in this object"; } else { } } return "Sorry, there are no true values in this object"; }; 

Quando você usa notação de ponto, key significa a propriedade real no object, que não estará lá. Então, undefined é retornado, o que não é igual a true .

Quando você usa a notação [] , está acessando a propriedade no object com o nome na key variável. Então, isso vai funcionar.

Por exemplo,

 var myObj = { myVar : 1 }; for (var key in myObj) { console.log(key); console.log(myObj.key); console.log(myObj[key]); } 

Isto irá imprimir,

 myVar undefined 1 

Porque, myObj não tem um membro chamado key ( myObj.key tenta obter o membro com a key nome) e no próximo caso, myObj tem um membro chamado myVar ( myObj[key] tenta obter o membro com o valor na key ) .

Notação de ponto

O jslint prefere a notação de ponto .

[] Notação

Isso oferece flexibilidade. Você pode acessar dinamicamente os membros com uma variável.

A notação de pontos é mais rápida de escrever e mais clara de ler.

A notação de colchetes permite o access a propriedades contendo caracteres especiais e seleção de propriedades usando variables.

 

Exemplo com erros:

 var inputs = myForm.foo[]; 

A notação de colchetes, por outro lado, permite:

 var inputs = myForm["foo[]"]; 

Como os colchetes são parte de uma string, seu significado especial não se aplica. A segunda vantagem da notação de colchetes é quando se trata de nomes de propriedades variables.

 for (var i = 0; i < 10; i++) { doSomething(myForm["myControlNumber" + i]); }