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)=>{
    
  }) 

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 unserer Funktion nicht zur Verfügung stellen, da dies auch bei der Tiefeneigenschaft häufig passieren kann.

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

 const cubes = geometriesRaw.map(({x,y, width, color})=>{
    
  }) 

Jetzt verwenden wir nur noch x, y, Breite, 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 Drittanbietern 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