ES6 Deep Deconstruction

Destructuring is a syntax for extracting values ​​from an array or object and assigning them to individual variables. Deep destructuring means that for nested data structures (for example, objects contain objects, arrays contain arrays or objects, etc.), multi-level destructuring assignments can be achieved with one line of code. This allows for easier access and use of data in nested structures.

1. Object Depth Destructuring:

 let person = {
    
    
      name: 'mm',
      data: {
    
     code: 0, data: {
    
     city: ['广州', '深圳'], page: [2, 2, 3, 3] } },
    }
    const {
    
     name, data: {
    
     data: {
    
     city: citys, page } , code } } = person;
    console.log("name", name)     // mm
    console.log("city", citys)    // ['广州', '深圳']
    console.log("page", page)     // [2, 2, 3, 3]
    console.log("code", code)     // 0

2. Array depth destructuring:

const numbers = [1, 2, [3, 4]];

// 深度解构赋值
const [a, b, [c, d]] = numbers;

console.log(a); //  1
console.log(b); //  2
console.log(c); //  3
console.log(d); //  4