Javascript 动态设置react状态时为何使用类似数组的语法

下面是

react

对于动态设置

状态

，我们通常会这样做

handleChange: function (e) {
    this.setState({[e.target.name]: e.target.value})
}

但如果我们手动输入名称，则不需要数组

handleChange: function (e) {
    this.setState({name: e.target.value})
}

---

有人能告诉我们，当

动态地
获取
名称时，为什么要将
e.target.name
放在
类似数组的语法中
？
Javascript将对象的键作为字符串进行计算。因此，[e.target.name]意味着访问名为e.target.name值的键（转换为字符串），而name:被解释为名为“name”的键。
这是ES6语法，它被称为计算键。有关更多详细信息，请参见，但本质上无论
e.target.name
是什么，它都将被设置为对象键

handleChange: function (e) {
    this.setState({[e.target.name]: e.target.value})
}

这与在ES5中执行此操作相同（更详细）：

这就是ES6语法，它被称为计算键。有关更多详细信息，请参见，但本质上无论
e.target.name
是什么，它都将被设置为对象键

handleChange: function (e) {
    this.setState({[e.target.name]: e.target.value})
}

这与在ES5中执行此操作相同（更详细）：

可能的重复可能的重复