title: JavaScript: Arrow Function with Destruction?
body: <p>On <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions" rel="noreferrer">MDN</a>, the following code is used as an example of how arrow functions are used to write shorter functions.</p>
  
  <pre><code>var materials = [
    'Hydrogen',
    'Helium',
    'Lithium',
    'Beryllium'
  ];
  
  materials.map(function(material) { 
    return material.length; 
  }); // [8, 6, 7, 9]
  
  materials.map((material) =&gt; {
    return material.length;
  }); // [8, 6, 7, 9]
  
  materials.map(({length}) =&gt; length); // [8, 6, 7, 9]
  </code></pre>
  
  <p>I understand the two first. What exactly is going on in the last function?</p>
  
  <p>Is it an ES6 object destructuring assignment (i.e. when a material String object is received as an argument from map, the length property of that string is destructured into a length variable, then returned by the arrow function)?</p>