CODEWITHSUNDEEP
javascriptarraysobjectrecursion
Micarisomz
Micarisomz

Reputation: 11

I want to append the result of a recursive function to the child node of an object

Basically, I am trying to transform an array into a specific data format for a file-tree module in react. The problem is that the recursive function appends '[Object]' to the child node instead of the actual object it returns i.e ( {name: fileName}).

const transformData = function (path, arr = []) {

if(path.length === 1){
    var fileName = path.pop(0)
    console.log(fileName + ' is a File')
    arr.push(
        {name: `${fileName}`}
    )
    console.log('File : ', arr)
    return arr


}else{
    var name = path.splice(0,1).pop()
    console.log(name, path)
    arr.push({
        name: `${name}`,
        //the child node below returns '[Object]'
        childNode: transformData(path)

    })

    console.log('Folder : ', arr)
    return arr
}

}



 var path = ['Template', 'temp','temp2', 'file.txt']
 var tree = transformData(path)
 console.log('data : ', tree )

If you run the code snippet above, it produces the following as output

Template [ 'temp', 'temp2', 'file.txt' ]
temp [ 'temp2', 'file.txt' ]
temp2 [ 'file.txt' ]
file.txt is a File
File :  [ { name: 'file.txt' } ]
Folder :  [ { name: 'temp2', childNode: [ [Object] ] } ]
Folder :  [ { name: 'temp', childNode: [ [Object] ] } ]
Folder :  [ { name: 'Template', childNode: [ [Object] ] } ]
//Final result
data :  [ { name: 'Template', childNode: [ [Object] ] } ]
*******************************
Expected Output
*******************************
data :  [ { name: 'Template', childNode: [ { name: 'temp',childNode [{name: 'temp2', childNode: [{ name: 'file.txt' } ] }

Upvotes: 1

Views: 191

Answers (3)

Rubén Morales Félix
Rubén Morales Félix

Reputation: 652

The problem is your console try running the snippet in a different environment, by default console.log does not convert all data to string so you might have to use JSON.stringify to convert your data to string before you print it.

enter image description here

const transformData = function (path, arr = []) {

  if(path.length === 1){
      var fileName = path.pop(0)
      console.log(fileName + ' is a File')
      arr.push(
          {name: `${fileName}`}
      )
      console.log('File : ', arr)
      return arr


  }else{
      var name = path.splice(0,1).pop()
      console.log(name, path)
      arr.push({
          name: `${name}`,
          //the child node below returns '[Object]'
          childNode: transformData(path)

      })

      console.log('Folder : ', JSON.stringify(arr))
      return arr
  }

}



 var path = ['Template', 'temp','temp2', 'file.txt']
 var tree = transformData(path)
 console.log('data : ', tree )

Upvotes: 0

Paddy Hamilton
Paddy Hamilton

Reputation: 157

I think that the object is there and its as you expect. It's just that the console.log isn't showing you more of the output.

first, just try logging the first child node at the end and it should be there e.g console.log(tree[0].childNode[0])

Upvotes: 0

Jonas Wilms
Jonas Wilms

Reputation: 138277

The NodeJS console is very limited, it provides no ways to interact with the data shown, instead it just shows a contrived version of the data you are logging as a string. If you would log a very huge object with thousands of properties, the console would overflow, and would log much more information than you actually need. Thats why the console only shows nested objects up to a certain level, then it only shows [Object] to indicate that it goes deeper.

The console is just not meant for debugging, I highly recommend using the Chrome Inspector with NodeJS, there you can unflatten objects to any depth (among other very useful things).

Upvotes: 3

Related Questions