js中对对象属性读取两种方法的区别

读取js中对象的属性通常有两种方法，一种是使用点运算符，还有一种是使用方括号运算符；

var obj = {
    key: 'value'
}
obj.key; //value
obj['key']; //value
复制代码

js教程里说使用方括号运算符时，键名必须放在引号内，否则会当作变量处理，例子如下

var key = 'lock';
var obj = {
    key: 'value1',
    lock: 'value2'
}
obj.key; //value1
obj[key]; //value2
obj['key']; //value1
复制代码

基本可以理解为obj.key = obj['key'], 稍微复杂点的例子：

var obj = {a: 1, b: 2, i: 3, c: 4};

for (var i in obj) {
  console.log(i); //a, b, i, c
  console.log(obj[i]); //输出 1，2，3，4    
  console.log(obj.i); //输出3, 3, 3, 3
}

console.log(i); //c
console.log(obj.i); //输出3 name = 'i';
console.log(obj[i]); //输出4 name = i = c
复制代码

也就是说obj[key]是把key当成一个变量来对待，上面的例子里就是i=c,obj[i]=obj[c]=4 而obj.key是把key当作一个字符串,在上面的例子里就是obj.i = obj['i'] =3；如果对象里面没有key这个属性，那obj.key会输出undefined