Destrukturierung in Funktionsparametern

Angenommen, ich habe ein Projekt in three.js und benötige einige Geometrien. Ich werde ein Array von Objekten fest codieren, das auch deren x-, y- und z-Werte enthält ihre Breiten-, Höhen- und Tiefenwerte, aber dieses Array könnte vom Server oder APIs von Drittanbietern stammen =>

const geometriesRaw = [
    {
      color: 0x44aa88,
      x: 0,
      y: 1,
      z: 0,
      width: 1,
      height: 1,
      depth: 1
    },
    {
      color: 0x8844aa,
      x: -2,
      y: 1,
      z: 0,
      width: 1.5,
      height: 1.5,
      depth: 1.5
    }

  ];

Dann werde ich sie mithilfe des Arrays rendern. Kartenfunktion =>

  const cubes = geometriesRaw.map((cube)=>{
    <mesh position={[cube.x, cube.y, cube.z]}>
        <boxGeometry args={[cube.width, cube.height, cube.depth]} /> 
        <meshPhongMaterial color={cube.color} /> 
      </mesh>
  }) 

Auf einen Blick können wir die Ausführlichkeit dieses Codes erkennen, indem wir den Argumentwürfel jedes Mal wiederholen.
Ein weiteres Warnsignal ist die Unklarheit darüber, welche Eigenschaften wir aus dem Array verwenden. Beispielsweise ist z in beiden Fällen 0 und wird in den allermeisten Fällen wahrscheinlich Null sein.
Für unseren regulären Anwendungsfall sollten wir diese Eigenschaft nicht unserer Funktion zur Verfügung stellen, da dies auch bei der Tiefeneigenschaft häufig passieren kann.

Aus diesem Grund ist die beste Option die Destrukturierung der Eigenschaften, die aus dem Array von Objekten stammen, wie folgt =>

 const cubes = geometriesRaw.map(({x,y, width, color})=>{
    <mesh position={[x, y, 0]}>
        <boxGeometry args={[width, 1, 1]} /> 
        <meshPhongMaterial color={color} /> 
      </mesh>
  }) 

Jetzt verwenden wir nur noch x, y, Breite und Farbe. Auf diese Weise implizieren wir, dass z, Höhe und Tiefe Standardeigenschaften innerhalb unserer Funktion sind und wir sie nicht aus den Daten benötigen, die von unserem Server oder Dritten stammen

Auf diese Weise verbergen wir Eigenschaften für zukünftige Entwickler, die mit der Konstante unserer Cubes interagieren werden, und zeigen ihnen nur diejenigen, die wir von einer externen Quelle benötigen, und diejenigen, die wir zur besseren Praxis als Standard festlegen, die wir sogar schreiben können
const z = 0
...
innerhalb unserer Funktion, um es noch klarer zu machen

Das obige ist der detaillierte Inhalt vonDestrukturierung in Funktionsparametern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!