Question

我正在阅读一些推文，但我遇到了this tweet by Dan Abromov

语法让我感到困惑。

const Font = ({ children }) => 
 <Block...

孩子周围的 {} 有什么意义？显然它不是一个对象。我推测它的ES2015功能。

非常感谢

Answer 1

这是一种解构绑定模式。它表示参数children应该绑定到传递给函数的对象的children属性的值。

在ES2015环境中试试这个：

function x({ foo }) {
  console.log(foo);
}

x({ hello: "world", foo: "bar", well: "that's all"});

字符串“bar”将被记录到控制台，因为这是传递给函数的对象的“foo”属性的值。

如果传递给函数的值是没有“children”属性的对象，如果它根本不是对象，则参数将为undefined。