JavaScript assign array with nested arrays/objects as the attribute of another object

Question

I have an array with objects with nested arrays that looks like this:

var category_tree = [
    {
        category_id: 1,
        name: "A",
        children: [
            {
                category_id: 2,
                name:" B, child of A",
                children: [
                    {
                        category_id: 3,
                        name: "C, child of B",
                    }
                ]
            }

        ]
    }
]

I want to take another object that looks like this:

{ 
    categories: []
    isFetching: false, 
    isValid: false, 
    currentFilter: "NAME_ASCENDING", 
    displayError: false, 
    errorMessage: ""
}

And set the categories attribute equal to this category_tree object.

Unfortunately no matter what I try, I lose everything from the children key down:

{ 
    categories: [{
        category_id: 1,
        name: "A",
        children: []
    }],
    isFetching: false, 
    isValid: false, 
    currentFilter: "NAME_ASCENDING", 
    displayError: false, 
    errorMessage: ""
}

So that's my question: how do I assign a nested array/object as the attribute of an object?

Edit: What I have tried:

let newState = Object.assign({}, state, {                                                 
        isFetching: false,                                                                    
        valid: true,   
        categories: category_tree                                                   
    })

let newState = Object.assign({}, state, {
    isFetching: false,
    valid: true
})
newState.categories = category_tree

Desired result:

{ 
    categories: [
        {
            category_id: 1,
            name: "A",
            children: [
                {
                    category_id: 2,
                    name:" B, child of A",
                    children: [
                        {
                            category_id: 3,
                            name: "C, child of B",
                        }
                    ]
                }

            ]
        }
    ],
    isFetching: false, 
    isValid: false, 
    currentFilter: "NAME_ASCENDING", 
    displayError: false, 
    errorMessage: ""
}

`newCat.categories = category_tree.slice(0);` after fixing typos — mplungjan, Apr 13 '18 at 08:26
Slice seems to still lose the objects in this case: `console.log(category_tree.slice(0))` shows that the arrays are empty. However, `_.cloneDeep(category_tree)` maintains the objects, but they are still lost when I try assigning that to newState, ie. `newState.categories = _.cloneDeep(category_tree)` — Daniel Thompson, Apr 13 '18 at 08:30
@mplungjan I understand that the questions are similar; but I am unclear on what to do about the arrays nested in the objects in the arrays that I am copying. I actually knew how to copy an array of objects, but an array of objects with arrays of objects seems to be the issue. Is this an irrational usecase for JavaScript? I didn't realize it would be so much trouble, maybe I should just redesign the API to send more flat data to begin with. — Daniel Thompson, Apr 13 '18 at 08:34
Please have a look at my undeleted answer - what is missing there? — mplungjan, Apr 13 '18 at 08:35

mplungjan · Accepted Answer · 2018-04-13T08:46:02.627

1

I have undeleted to show that slice seems to do what you want

newCat.categories = category_tree.slice(0);

Like this

var category_tree = [{
  category_id: 1,
  name: "A",
  children: [{
      category_id: 2, // added a comma
      name: " B, child of A",
      children: [{
        category_id: 3,
        name: "C, child of B",
      }]
    }

  ]
}]

var newCat = {
  categories: [], // added a comma
  isFetching: false,
  isValid: false,
  currentFilter: "NAME_ASCENDING",
  displayError: false,
  errorMessage: ""
}

newCat.categories = category_tree.slice(0)

console.log(JSON.stringify(newCat,null, 2));

edited Apr 13 '18 at 08:46

answered Apr 13 '18 at 08:19

mplungjan

169,008
28
173
236

Ack sorry for the typos; as for the solution, wouldn't that only work for one index in the categories? What I want to do is reassign the entire array to this new array (which in the example only has one object in it, but could have many) – Daniel Thompson Apr 13 '18 at 08:23
1

Ahh wow you're right, sorry. In my environment on the next line I am returning this object, and it must be some operation down the line where I mutate the object unwittingly, causing my console log to point to an object with emptied children (for whatever reason). It seems that I have failed to write quality functional code. – Daniel Thompson Apr 13 '18 at 08:45
many thanks, you are very kind! – Daniel Thompson Apr 13 '18 at 08:45
No problem, you are welcome :) – mplungjan Apr 13 '18 at 08:46

JavaScript assign array with nested arrays/objects as the attribute of another object

1 Answers1