括号周围的参数 - 为什么？ [复制]

Question

我在教程中遇到过这个：

const Todos = ({todos}) => (
  <div>
    <h1>Todos</h1>
    {todos.map(todo => <p key={todo}>{todo}</p>)}
  </div>
)

为什么参数周围有大括号？如果我自己写，第一行应该是这样的：

const Todos = (todos) => (...

这是我根本找不到文档的一些古怪的新 ES6 语法吗？

Answer 1

这是 parameter object destructuring 的语法，它是作为 ECMAScript 2015 的一部分引入的。Todos 函数没有定义名为 todos 的单个参数，而是访问 @ 987654324@ 传入的对象的属性（并立即解构）。

大致相当于以下版本：

const Todos = (_param) => {
  let todos = _param.todos;
  return (
    <div>
      <h1>Todos</h1>
      {todos.map(todo => <p key={todo}>{todo}</p>)}
    </div>
  );
};

查看Destructuring and parameter handling 了解有关解构的更多信息。