這兩者的主要區別是：. 操作符要求屬性名滿足標識符的命名規範。而[..] 操作符可以接受任意字符串作為屬性名。

  var obj = {};
  obj["12@qq"] = "[email protected]";
  console.log(obj["12@qq"]); //[email protected]
  console.log(obj.12@qq);   //報錯

此外：[...] 可以使用字符串訪問屬性，所以可以在程序中構建這個字符串。如：

  var name = "kevin";
  var obj = {
    kevin : ‘personName‘,
    age:20
  }
  console.log(obj[name]) ;  
 
//personName
　console.log(obj.name) ; 　 //undefined

在對象中，屬性名永遠都是字符串。如果使用非字符串（string）的其他值作為屬性名，都會轉化成string類型，即使數字也不例外。

? 註意：在數組中使用數值作為下標訪問每一項，但是對象會把數值轉化成string類型。不要搞混了。

  var obj = {};
  obj[3] = "three";
  console.log(obj[3]); //three
  console.log(obj["3"]); //three
  console.log(obj["3"]===obj[3]);  //true
　console.log(obj.3); //報錯

綜上：

[]操作符總是能代替點操作符，點操作符總不能代替[]操作符。

[]操作符可以用變量來訪問屬性名，點操作符不能

[]操作符能用數值訪問屬性，點操作符不能。

對象的 [] 和 . 操作符的區別：