在组件主体外部声明函数有什么区别吗？

Question

请考虑以下示例：

const foo = string => "bar" + string;
class Example extends React.Component {
  foo = string => "bar" + string
  
  render = () => <p>
    {foo("asd"); this.foo("asd")}
  </p>
}

我唯一想到的是，组件主体内的函数可以访问它的属性，例如 props、state 和主体内的任何内容，包括函数，但我们也可以将它们作为外部函数的参数传递。那么这是唯一的"优点或缺点"，还是有更高级的东西？

Answer 1

在 React Native 的情况下，在类之外声明一个函数就像创建一个静态函数。如果将函数放在类中，则将为类的每个实例创建该函数，在这种情况下，这是不必要的。

在您的示例中，我会考虑 foo（） 是否应该只在该文件或其他文件中使用。在后者的情况下，创建一个名为utils/的单独文件夹，将函数放在那里并将其导入到需要的地方。

当涉及到 props 时，你可以在类之外创建函数并使用 call（） 调用它，然后可以访问 props：

foo.call（this）;

const foo = （） => console.log（this.props）;