Javascript JS中的括号用于获取值

这项工作：

  handleOnChange(e) {
    this.setState({[e.target.id]: e.target.value});
  }

e.target.id

用括号括起来（

[]

），而

e.target.value

则不是

我也可以将

e.target.value

写在括号中，这样可以工作，但如果我从

e.target.id

中删除括号，我的代码将无法工作。为什么?

我做了一些研究，认为这是因为（虽然我不确定），但是问题出现了，为什么

e.target.id

的属性需要计算，而

e.target.value

不需要？我认为，这两种价值观都只是价值观

为什么需要计算e.target.id的属性，而e.target.value不需要计算

右侧始终是一个值（并且一直是）

历史上，左侧是字符串或标识符。将表达式（计算属性名）放在其中的功能是一项新功能

const foo=“bar”；
//这里的属性名是foo，因为它是一个标识符
常量对象={
福：福
};
控制台日志（obj）；
//这里的属性名是foo，因为它是一个字符串
常数obj2={
“foo”：foo
};
console.log（obj2）；
//这里属性名为bar，因为它是通过求值常量计算的
常数obj3={
[foo]：foo
};
控制台日志（obj3）；
//这里的属性名是barbar，因为它是通过求值函数调用计算的，该函数调用返回两次使用该常量的模板字符串
函数blah（）{
返回`${foo}${foo}`；
}
常数obj4={
[blah（）]：foo
};
控制台日志（obj4）；
//这与上一个示例相同，只是因为右侧始终是一个值，所以将代码包装在方括号中意味着它被视为数组文字（而不是计算属性，这正是方括号在左侧的含义）
函数blah（）{
返回`${foo}${foo}`；
}
常数obj5={
[blah（）]：[foo]
};
控制台日志（obj5）因为
{foo.bar:“fizz”}
与
{foo.bar:“fizz”}
的意思并不相同，事实上，这在语法上甚至都不正确


const a={b:c}；
const foo={a.b:“d”}；//错误
console.log（foo）
我也可以将e.target.value写在括号中，这样也可以，但是如果我从e.target.id中删除括号，我的代码将无法工作。为什么?

这两对括号的用途截然不同：在

{ [keyName]: value }

您确实有一个计算属性名。在

{ keyName: [value] }

但是，
[value]
周围的括号创建了一个数组。
e.target.value
和
[e.target.value]
不一样。第一个将只表示值，而最后一个将创建一个数组，其中包含一个表示值的条目；这取决于包含此代码的应用程序是如何构造的，以及
this.setState（）
方法所期望的内容。可能的重复这些都是很好的示例，可以让我完全理解正在发生的事情，干杯！