对象数组解构并重命名变量时的语法错误问题

嘿，我懂你的需求啦～你想从数组里把Mike的年龄提取到age2变量里，但原来的解构写法出了语法问题，我来帮你捋清楚：

错误原因分析 #

你写的let [first: {age: age2}] = arr之所以报错，是因为数组解构不需要用键名（比如first:），数组解构是按元素的位置来匹配的，first:这种写法是对象解构里才会用到的键值对语法，放在数组解构里就会触发语法错误。

正确的写法 #

直接对数组的第一个元素进行对象解构就可以了，写法很简单：

let arr = [ { "name": "Mike", "age": 29 }, { "name": "Michael", "age": 24 } ];
let [{ age: age2 }] = arr;
console.log(age2); // 输出 29

拆解一下逻辑 #

1. 外层的[]是数组解构，[{ ... }]表示取数组的第一个元素
2. 内层的{ age: age2 }是对象解构，表示把这个元素对象里的age属性值，赋值给变量age2

如果觉得一步到位有点绕，也可以拆成两步写，更直观：

let arr = [ { "name": "Mike", "age": 29 }, { "name": "Michael", "age": 24 } ];
// 第一步：取出数组第一个元素
const mike = arr[0];
// 第二步：从对象里解构age到age2
const { age: age2 } = mike;
console.log(age2); // 输出 29

这样两种写法都能达到你想要的效果，选你觉得顺手的就好～

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