I was reading https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions which contains the following code snippet:
var elements = [
'Hydrogen',
'Helium',
'Lithium',
'Beryllium'
];
elements.map(function(element ) {
return element.length;
}); // [8, 6, 7, 9]
elements.map(element => {
return element.length;
}); // [8, 6, 7, 9]
elements.map(({ length }) => length); // [8, 6, 7, 9]
The last application of the arrow function seems very concise, as it does not even use the dummy variable element
. However, it is not clear to me how this works; I've seen how ({})
can be used on the right-hand side of an arrow function to return an object literal, but I haven't seen any examples of using it on the left-hand side.
Can someone explain the syntax of the last arrow function?