ES6对象数组解构：如何使用解构简化指定变量赋值代码？

这题太常见啦！ES6的数组解构语法完美解决这种重复从数组元素取属性的场景，给你两种简洁的写法：

写法一：先映射提取属性再解构 #

先通过map把someArray里每个元素的data属性提取出来，再解构到对应变量：

const [array0, array1, array2] = someArray.map(item => item.data);

写法二：直接解构数组中的对象属性 #

如果确定someArray至少有3个元素，也可以直接对数组里的每个对象进行解构，把每个对象的data属性重命名为你需要的变量：

const [{ data: array0 }, { data: array1 }, { data: array2 }] = someArray;

两种写法的小区别 #

• 写法一的优势是灵活性更高：不管someArray有多少元素，只会取前三个的data，如果数组长度不足3，后面的变量会是undefined，和原代码的行为完全一致。
• 写法二更直接高效：不需要额外的map遍历，直接从原数组的元素上提取属性，适合确定数组长度足够的场景。

内容的提问来源于stack exchange，提问作者ssss