这两者的主要区别是：. 操作符要求属性名满足标识符的命名规范。而[..] 操作符可以接受任意字符串作为属性名。

var obj = {};  obj["12@qq"] = "12@qq.com";  console.log(obj["12@qq"]); //12@qq.com  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); //报错

 综上：

[]操作符总是能代替点操作符，点操作符总不能代替[]操作符。

[]操作符可以用变量来访问属性名，点操作符不能

[]操作符能用数值访问属性，点操作符不能。