> [event.target.name]: event.target.value

Dumb question but I've never seen this syntax before. What does it do or what is it called? (The brackets)

Computed property names. Any expression whose value can convert to a string or symbol will work. ES6 added them:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...

Excellent, thanks!

It's not a dumb question at all. It's relatively new, and I would implore the originator of that comment to take a different tone. It requires a newer browser or some sort of transpilation step. (You're probably already using one if you're using React)

Most of the React community has forged forward with ES6/ES2015, so learning that is definitely a part of the process.

He may have chosen to use newer syntax, but the same pattern can be used without computed keys with only a tiny more code:

  var stateUpdate = {}
  stateUpdate[event.target.name] = event.target.value;
  this.setState=(stateUpdate);

I don't think there was anything necessarily wrong with his tone as he was addressing the tone of the original article.

Telling someone, "or maybe you should learn JavaScript" is kind a really jerky way of saying, "you don't know what you're doing". I do think it was a terrible way to share knowledge. Yet it was an excellent way to say, "I know more than you".

I agree it is rather combative, however it's also true. To claim that X pattern is a reason to not use a library when said pattern is actually an anti-pattern you've used because of lack of understanding is going to garner these kinds of reactions.

This is exactly what I've been using for a while now, and was hoping something better already existed in ES6. Great to know there is!

FWIW, this is supported in the newest Chrome as well.