可以使用React的useMemo或useCallback来缓存函数的结果，避免多次执行某个函数。

示例代码：

import React, { useMemo } from 'react';

function App() {
  const data = [1, 2, 3, 4, 5];

  // 声明一个memoized函数来计算data数组的总和
  const totalSum = useMemo(() => {
    console.log('calculate total sum');
    return data.reduce((acc, val) => acc + val, 0);
  }, [data]);

  // 声明一个函数来显示totalSum的值
  function displayTotalSum() {
    alert(`Total sum: ${totalSum}`);
  }

  return (
    

      
Data:
      {data.map((num) => (
        
{num}
      ))}

      Show total sum
    
  );
}

export default App;

在这个示例中，我们使用了React的useMemo来缓存一个计算data数组总和的函数。当data改变时，totalSum才会重新计算。

我们还声明了一个函数displayTotalSum来显示totalSum的结果。每次渲染App组件时，displayTotalSum函数都会被重新创建。但是，因为我们使用了memoized函数，totalSum只会在data改变时重新计算，从而避免了多次执行计算总和的操作。