前言

JavaScript中，访问对象的属性的方式有两种，分别是使用点语法和[]语法。如下：

var person = {name: "ws", address: "beijing"}
// 使用点语法设置属性
person.name = "纯钧"

// 使用[]语法设置属性
person["name"] = "纯钧"

如上，这两种设置属性的方式是等价的。

使用点语法访问对象的属性使我们所熟知的。Java、Python、Objective-C等很多语言都支持点语法访问对象的属性。
使用[]访问对象的属性看起来更像数组，只是这个数组元素是通过字符串所以而非数字索引。即[]中写的是字符串或者是可以转化为字符串的表达式(所以也可以是一个数字)。这种数组就是我们常数的“关联数组（associative array）”，也称作散列、映射、字典。JavaScript对象都是关联数组，即都是字典。

JavaScript动态创建/访问属性

在C、C++、Java、Objective-C等一些强类型语言中，对象只能拥有固定数目的属性。即对象的属性都是预先声明的，不允许在运行时动态的创建属性。而JavaScript是弱类型语言，在运行时程序仍然可以给任意对象创建任意数量的属性。
所以对象的属性可以是预先声明的，也可以是程序运行期动态创建的。但通过点运算符访问对象的属性时，属性名用一个标识符表示，标识符必须直接出现在JavaScript程序中(例如上例中的person.name，其中name就是标识符)。即使用点语法访问的属性必须是预先声明的。
反过来讲，当通过[]来访问对象的属性时，属性名通过字符串来表示。字符串是JavaScript的数据类型，在程序运行时可以修改和创建他们。因此，可以在JavaScript中可以使用下面这种代码：

var address = ""
for (i = 0; i < 3; i++) {
address += customer["address" + i]
}

这段代码读取customer对象的address0、address1、address2属性，并将它们连接起来。而使用点语法是做不到的。

[]语法添加/访问属性的场景

凡是可以使用点语法访问属性的地方都可以使用[]来访问对象的属性。但使用[]语法访问属性的地方未必可以使用点语法。点语法只能访问对象预先声明的属性。所以，当存在动态访问属性的时候，必须使用[]的写法。

[]中不一定必须写字符串或者字符串表达式，也可以写数字或者JavaScript可以转换为字符串的表达式。

假设你正在写一个程序，这个程序是统计员工的工资。程序接收员工的姓名和工资金额作为输入参数，使用名为employee的对象存储这些信息。每个员工在这个employee对象中都有对应的属性，属性名就是员工的名称，属性值就是员工的工资。例如，员工姓名（属性名）是”ws”，工资（属性值）是“”$100000“。如下函数简单实现了统计员工工资的功能：

function employee2Salary(employee, name, salary) {
employee[name] = salary;
}

因为name是外部输入的，程序无法预先定义好这些属性名，所以无法使用点语法来访问对象的属性，以上程序的属性设置和读取只能用数组的写法[]来完成。

总结：使用[]写法，因为[] 内使用的是字符串，字符串只是动态的，可以在运行时更改，而点语法的标识符是静态的，必须预先写死在程序中，不能够更改。理解这一点非常重要。

敬请期待~