Javascript 如何设置常数'；州'；变量使用钩子？

假设我有一些状态变量

width

，我知道它永远不会改变，但我需要根据收到的道具对它进行一些计算。我不想在函数体中这样做，因为它将在每次重新渲染时运行。因此：

const SOME_CONSTANT_NUMBER = 50;

const someFunc = ({multiplier: number}) => {
  const [width, setWidth] = useState(SOME_CONSTANT_NUMBER * multiplier);

  return (
    <div>
      {width}
    </div>
  );
}

我认为最糟糕的方法如下，因为它会在每次重新招标时计算：

const SOME_CONSTANT_NUMBER = 50;

const someFunc = ({multiplier: number}) => {
  const width = SOME_CONSTANT_NUMBER * multiplier;
  return (
    <div>
      {width}
    </div>
  );
}

const SOME_CONSTANT_NUMBER=50；
常量someFunc=（{multiplier:number}）=>{
常数宽度=一些常数*乘数；
返回(
{width}
);
}

*注意：这个例子很简单，但是假设有更多的道具，并且这个

宽度的计算在计算上很繁重。
正是这个用例

 const width = useMemo(() => SOME_CONSTANT_NUMBER * multiplier, [multiplier]);

请注意，
useMemo
本身是有成本的（这是另一个函数），因此只有当您知道计算值非常昂贵时才应该使用它。这意味着：会导致延迟（如果不是，您应该真正检查性能，并且
useMemo
是否会增加它）。
您实际上不需要在状态上对其进行序列化，但让我们遵循您的方法：

const MY_RATIO = 3
const SomeComponent = ({value}) =>{
    const [state, setter] = useState(value * MY_RATIO)
    useEffect(() =>{
        setter(value * MY_RATIO)
    }, [value, MY_RATIO])
}

现在，您仅在道具
值更改时更新状态。但更好的方法是使用
usemo

const memoizedValue = useMemo(() => MY_RATIO * value, [MY_RATIO, value])

看起来你应该使用useMemo钩子

如果你需要用新的道具运行计算，那么你就必须重新计算，不是吗？这就是钩子的工作原理，除非你想记忆，然后仍然需要检查乘数是否改变了DHMMM，那么如果它在一个相对较短的数组上迭代，比如在20以下，然后稍微操纵它以返回一个新数组？如果在这种情况下，
useMemo
的成本太高，那么不重新计算重新招标人的建议方法是什么？⚠ 注意！这个答案可能有误导性。在useRef文档中：“您可以将UseMoom作为性能优化，而不是语义保证。将来，React可能会选择“忘记”一些以前记忆的值，并在下次渲染时重新计算[…]”。我来寻找一个有保证的稳定值，因为这似乎是问题的目的，但useMemo不是。i、 e.如果你的代码在使用和不使用UseMoom时都能正常工作，那么你就很好，否则你就用错了。根据文档：“编写代码，使其在没有UseMoom的情况下仍能正常工作，然后添加代码以优化性能。”如果UseMoom在将来不再工作，你有没有想法编写代码？使用异常？此处所述的否决理由：如果按照文档中的指导原则“编写代码，使其在没有useMemo的情况下仍能工作，然后添加代码以优化性能”，则解决方案可以得到改进。Hi@AizzatSuhardi感谢您的评论。如果你看一下我的答案，我想你会发现无论有没有useMemo，它都会工作得一模一样，这正是这个钩子的预期用例。问题是如何为计算代价高昂的计算优化性能
const width=SOME_CONSTANT_NUMBER*乘数
的工作原理与将其包装在备忘录中完全相同，但会阻止它在每次渲染时重新计算。我没有保证这个值永远不会被重新计算，但是在大多数正常情况下它会被记录下来。当然，正如问题中所说的，这个例子显然没有用，这是一个人为的例子来提问。useMemo应仅用于计算昂贵的值。
const memoizedValue = useMemo(() => MY_RATIO * value, [MY_RATIO, value])

    const width = useMemo(() => SOME_CONSTANT_NUMBER * multiplier , [multiplier])