Question

我在教程中遇到过这个问题：

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

为什么参数周围有括号？如果我自己写的话，第一行看起来像这样：

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

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

Answer 1

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

大致相当于以下版本：

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以获取有关解构的更多信息。

围绕参数括号 - 为什么？

1 个答案: