web-dev-qa-db-ja.com

変数のパフォーマンスの破壊

書き込みの間にパフォーマンスの違いがありますか？

const color = props.color;

vs

const { color } = props;

また、パラメータシグネチャで構造を解除すると、パフォーマンスが向上または低下しますか？ example3を参照してください

この状況でのexample3が関数を書くための最良の方法だと思いますか？

機能的な反応コンポーネントの例：

const example1 = (props) => {
  const color = props.color;
  // I know I could also just write style={{ color: props.color }}
  // but for arguments sake lets say I want to write it like this.
  return <h1 style={{ color }}>Hello</h1>;
};

const example2 = (props) => {
  const { color } = props;
  return <h1 style={{ color }}>Hello</h1>;
};

const example3 = ({ color }) => {
  return <h1 style={{ color }}>Hello</h1>;
};
javascriptreactjsecmascript-6destructuring
14
Christian Bangert

コードがコンパイル/縮小されるなど、パフォーマンスの問題は発生しません。

Reactを使用すると、コードがトランスパイルされ、同じように動作することに注意してください。

const color = props.color

babelコンパイラオンラインテスター で結果を確認してください

5
yuantonito