深度解构

在封装request的那一章，就用到了深度结构。目前理解的不是很深，通过几个项目的跟进，

我觉得通过深度结构，可以更直观地表示数据的层级关系，使代码更加易于理解。见的多的就是在函数中使用深度解构，开发者可以通过深度封装提高接口的安全性，
通过深度解构有效地提取嵌套对象或数组的值，能够更高效地处理复杂数据结构，从而提升代码的质量和维护性。

在前面封装request中就用到了深度解构

export function request(flig = {}){ //解构

let {
url,
method = ‘GET’, //这里可以更换post啥的请求方式
data = {},
headers = {}
} = flig;

这个就是函数中使用深度解构，使用request函数传入值，然后就从flig中解构数据，这里的函数解构就像是先压缩后解压，当你传入的对象属性名与函数内部解构的变量名相同时，可以直接使用变量名，而无需显式地进行重命名

写一个解构例子

const person = {
name: ‘Bob’,
contact: {
email: ‘bob@example.com’
}
};

// 深度解构并设置默认值
const {
name,
contact: { email, phone = ‘N/A’ }//这里phone设置默认值，也可以重新命名，也可以说是小名
} = person;

console.log(name); // 输出: Bob
console.log(email); // 输出: bob@example.com
console.log(phone); // 输出: N/A

那就用前面用过的一个

这里是上一篇链式调用，就拿第一个narv()说说吧，由于这里的data中有多条数据，每条数据中都有一个id，不适用解构，解构起来有点麻烦,看图理解

const res = await narv();
let {data} = res;
const [firstId,…otherId] = data; //这里的…是展开的意思
let id = firstId.id;//展开之后将第一条数据給firstId 所以后面要加.id
//……. 如果要其他id …….
//const otherIds = otherId.map(({id})=>id);//提取其他id 返回的是一个数组
//如果要其他id的第一个就打印otherIds[0]
//…………