Skip to content
Advertisement

traverse through nested children of an array of objects and make a property equals false – JavaScript

I have a tree, that I want to traverse through. I want to make each internalChecked = false. I wrote some code, but failed.

Tree

let json = [
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Steel",
    "value": 2,
    "internalChildren": [
      {
        "internalDisabled": false,
        "internalChecked": true,
        "internalCollapsed": false,
        "text": "Cars",
        "value": 54,
        "internalChildren": [
          {
            "internalDisabled": false,
            "internalChecked": true,
            "internalCollapsed": false,
            "text": "Sedan",
            "value": 55,
            "internalChildren": [
              {
                "internalDisabled": false,
                "internalChecked": true,
                "internalCollapsed": false,
                "text": "test",
                "value": 1053
              },
              {
                "internalDisabled": false,
                "internalChecked": true,
                "internalCollapsed": false,
                "text": "cc cc cc",
                "value": 1054,
                "internalChildren": [
                  {
                    "internalDisabled": false,
                    "internalChecked": true,
                    "internalCollapsed": false,
                    "text": "cccccc",
                    "value": 1055
                  },
                  {
                    "internalDisabled": false,
                    "internalChecked": true,
                    "internalCollapsed": false,
                    "text": "xxxxxxx",
                    "value": 1056
                  }
                ]
              }
            ]
          },
          {
            "internalDisabled": false,
            "internalChecked": true,
            "internalCollapsed": false,
            "text": "train",
            "value": 2053,
            "internalChildren": [
              {
                "internalDisabled": false,
                "internalChecked": true,
                "internalCollapsed": false,
                "text": "bullet",
                "value": 2054
              },
              {
                "internalDisabled": false,
                "internalChecked": true,
                "internalCollapsed": false,
                "text": "pessenger",
                "value": 2055
              }
            ]
          }
        ]
      }
    ]
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Auto/Boat",
    "value": 3
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Build Your Own Job",
    "value": 4
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Cleaning & Housekeeping",
    "value": 5
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Delivery & Courier",
    "value": 6
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Handyman",
    "value": 7
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Hourly Help",
    "value": 8
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Lawn & Yard",
    "value": 10
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Moving",
    "value": 11
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Organization",
    "value": 12
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Painting",
    "value": 13
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "Pet Care",
    "value": 14
  },
  {
    "internalDisabled": false,
    "internalChecked": true,
    "internalCollapsed": true,
    "text": "TV Mount & Electronics",
    "value": 15
  }
];


//CODE
let savedIndex
let outPut= []
let savedJson = json

function traverseArray(__json, __index){
    for (let i = 0; i < __json.length; i++) {
        const _item = __json[i];
        _item.internalChecked = false
        outPut.push({
            ..._item
        })
        if(_item.internalChildren && _item.internalChildren.length > 0){
            savedIndex = __index
            traverseArray(_item.internalChildren, i)
        }
    }
    return outPut
}

console.log(traverseArray(json, 0))

Advertisement

Answer

You are pushing every json chunk in an output array that makes the output different than it is, just use __json[i].internalChecked = false in your loop and it will update the array on which you are iterating on:

let json = [ { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Steel", "value": 2, "internalChildren": [ { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "Cars", "value": 54, "internalChildren": [ { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "Sedan", "value": 55, "internalChildren": [ { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "test", "value": 1053 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "cc cc cc", "value": 1054, "internalChildren": [ { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "cccccc", "value": 1055 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "xxxxxxx", "value": 1056 } ] } ] }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "train", "value": 2053, "internalChildren": [ { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "bullet", "value": 2054 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": false, "text": "pessenger", "value": 2055 } ] } ] } ] }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Auto/Boat", "value": 3 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Build Your Own Job", "value": 4 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Cleaning & Housekeeping", "value": 5 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Delivery & Courier", "value": 6 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Handyman", "value": 7 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Hourly Help", "value": 8 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Lawn & Yard", "value": 10 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Moving", "value": 11 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Organization", "value": 12 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Painting", "value": 13 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "Pet Care", "value": 14 }, { "internalDisabled": false, "internalChecked": true, "internalCollapsed": true, "text": "TV Mount & Electronics", "value": 15 } ];


let savedIndex
let savedJson = json

function traverseArray(__json, __index){
    for (let i = 0; i < __json.length; i++) {
        __json[i].internalChecked = false
        if (__json[i].internalChildren) {
            savedIndex = __index
            traverseArray(__json[i].internalChildren, i)
        }
    }
    return savedJson
}

console.log("original length:: ", json.length);
const output = traverseArray(savedJson, 0);
console.log("output length:: ", output.length);
 
console.log("output:: ", output);

Also, if clause,

if (__json[i].internalChildren && __json[i].internalChildren.length > 0)

can be simply

if (__json[i].internalChildren)
User contributions licensed under: CC BY-SA
6 People found this is helpful
Advertisement