如果您调用一个函数，该函数返回一个箭头函数作为您组件之一的属性，返回的箭头函数会反弹吗？

Question

我不想在每次重新渲染时都重新绑定一个函数。我有一个函数，该函数返回一个箭头函数（一个隐式绑定函数），该函数在渲染期间在另一个组件的属性内部被调用。

我担心每次重新渲染时都会反弹。如果是这样，这意味着我将在每次重新渲染期间为组件赋予新属性。如果我愿意，我会担心性能。

  bar = (foo) => () => {
    // Do some things
  }

  render() {
    return (
      <For
        each="foo"
        of={ foos }
      >
        <ExampleComponent
          baz={ this.bar(foo) }
        />
      </For>
    )
  }

我想知道baz是否在每次重新渲染期间都获得了新绑定的函数。

Answer 1

您是正确的-每次调用bar时，都会在每个渲染器上创建一个新的匿名箭头功能。

此问题的最常见解决方案是使bar成为可记忆的函数，以便它返回与上次调用时具有相同值foo的相同函数。只是不要忘记在备忘录缓存上设置缓存大小限制，否则您的内存使用量将永远不会减少。我建议使用memoize-one模块。