Ways to retrieve a list of identifiers from arrays at both initial and subsequent levels

Question

Ways to retrieve a list of identifiers from arrays at both initial and subsequent levels

I'm currently dealing with a JSON/JavaScript structure that looks like this:

{
  "comments": [
    {
      "id": 1,
      "content": "lorem ipsum",
      "answers": []
    },
    {
      "id": 2,
      "content": "lorem ipsum",
      "answers": [
        {
          "id": 30,
          "content": "lorem ipsum"
        }
      ]
    },
    {
      "id": 3,
      "content": "lorem ipsum",
      "answers": [
        {
          "id": 99,
          "content": "lorem ipsum"
        },
        {
          "id": 103,
          "content": "lorem ipsum"
        }
      ]
    },
    {
      "id": 5,
      "content": "comment",
      "answers": []
    }
  ]
}

My goal is to create an array that includes the id of all comments, regardless of whether they are main comments or answers.

The final array should look like this:

[1, 2, 3, 5, 30, 99, 103]

Is it possible to achieve this using only map, reduce, and filter?

What other approaches could I consider?

javascript json typescript

Answer 1

Answer №1

If you prefer using the flat method:

const data = {comments:[{id:1,content:"lorem ipsum",answers:[]},{id:2,content:"lorem ipsum",answers:[{id:30,content:"lorem ipsum"}]},{id:3,content:"lorem ipsum",answers:[{id:99,content:"lorem ipsum"},{id:103,content:"lorem ipsum"}]},{id:5,content:"comment",answers:[]}]};

function findIds(obj) {
  return obj.comments.map(com => {
    return [ com.id, ...com.answers.map(ans => ans.id) ]
  })
  .flat()
  .sort((a, b) => a - b);
}

console.log( findIds(data) ); // [1,2,3,5,30,99,103]

Alternatively, if you prefer to use only map and reduce:

const data = {comments:[{id:1,content:"lorem ipsum",answers:[]},{id:2,content:"lorem ipsum",answers:[{id:30,content:"lorem ipsum"}]},{id:3,content:"lorem ipsum",answers:[{id:99,content:"lorem ipsum"},{id:103,content:"lorem ipsum"}]},{id:5,content:"comment",answers:[]}]};

function findIds(obj) {
  return obj.comments.reduce((res, com) => {
    return [ ...res, com.id, ...com.answers.map(ans => ans.id) ]
  }, [])
  .sort((a, b) => a - b);
}

console.log( findIds(data) ); // [1,2,3,5,30,99,103]

Answer 2

If you prefer using the flat method:

const data = {comments:[{id:1,content:"lorem ipsum",answers:[]},{id:2,content:"lorem ipsum",answers:[{id:30,content:"lorem ipsum"}]},{id:3,content:"lorem ipsum",answers:[{id:99,content:"lorem ipsum"},{id:103,content:"lorem ipsum"}]},{id:5,content:"comment",answers:[]}]};

function findIds(obj) {
  return obj.comments.map(com => {
    return [ com.id, ...com.answers.map(ans => ans.id) ]
  })
  .flat()
  .sort((a, b) => a - b);
}

console.log( findIds(data) ); // [1,2,3,5,30,99,103]

Alternatively, if you prefer to use only map and reduce:

const data = {comments:[{id:1,content:"lorem ipsum",answers:[]},{id:2,content:"lorem ipsum",answers:[{id:30,content:"lorem ipsum"}]},{id:3,content:"lorem ipsum",answers:[{id:99,content:"lorem ipsum"},{id:103,content:"lorem ipsum"}]},{id:5,content:"comment",answers:[]}]};

function findIds(obj) {
  return obj.comments.reduce((res, com) => {
    return [ ...res, com.id, ...com.answers.map(ans => ans.id) ]
  }, [])
  .sort((a, b) => a - b);
}

console.log( findIds(data) ); // [1,2,3,5,30,99,103]

Answer 3

Answer №2

If you want to achieve the desired result, you can utilize Spread_syntax, concat, reduce, map, and sort methods found in arrays.

Take a look at the code snippet below:

ES6

var obj = {"comments":[{"id":1,"content":"lorem ipsum","answers":[]},{"id":2,"content":"lorem ipsum","answers":[{"id":30,"content":"lorem ipsum"}]},{"id":3,"content":"lorem ipsum","answers":[{"id":99,"content":"lorem ipsum"},{"id":103,"content":"lorem ipsum"}]},{"id":5,"content":"comment","answers":[]}};

let result = obj.comments.reduce((r,o)=>[...r, o.id,...o.answers.map(v=>v.id)],[]);

console.log(result.sort((a,b)=> a-b));

ES5

var data = {"comments":[{"id":1,"content":"lorem ipsum","answers":[]},{"id":2,"content":"lorem ipsum","answers":[{"id":30,"content":"lorem ipsum"}]},{"id":3,"content":"lorem ipsum","answers":[{"id":99,"content":"lorem ipsum"},{"id":103,"content":"lorem ipsum"}]},{"id":5,"content":"comment","answers":[]}};

//This function will return all the ids from the passed array based on the object data above.
function getIDs(obj) {
  var result = obj.comments.reduce(function(res, item) {
    var answers = item.answers.map(function(ans) {
      return ans.id;
    });
    res.push(item.id);//Adding id in array from main list
    return res.concat(answers);//Using contact method for add both arrays values 
  }, []);

  return result.sort(function(a, b) {
    return a - b;
  });
}


console.log(getIDs(data));

Answer 4

If you want to achieve the desired result, you can utilize Spread_syntax, concat, reduce, map, and sort methods found in arrays.

Take a look at the code snippet below:

ES6

var obj = {"comments":[{"id":1,"content":"lorem ipsum","answers":[]},{"id":2,"content":"lorem ipsum","answers":[{"id":30,"content":"lorem ipsum"}]},{"id":3,"content":"lorem ipsum","answers":[{"id":99,"content":"lorem ipsum"},{"id":103,"content":"lorem ipsum"}]},{"id":5,"content":"comment","answers":[]}};

let result = obj.comments.reduce((r,o)=>[...r, o.id,...o.answers.map(v=>v.id)],[]);

console.log(result.sort((a,b)=> a-b));

ES5

var data = {"comments":[{"id":1,"content":"lorem ipsum","answers":[]},{"id":2,"content":"lorem ipsum","answers":[{"id":30,"content":"lorem ipsum"}]},{"id":3,"content":"lorem ipsum","answers":[{"id":99,"content":"lorem ipsum"},{"id":103,"content":"lorem ipsum"}]},{"id":5,"content":"comment","answers":[]}};

//This function will return all the ids from the passed array based on the object data above.
function getIDs(obj) {
  var result = obj.comments.reduce(function(res, item) {
    var answers = item.answers.map(function(ans) {
      return ans.id;
    });
    res.push(item.id);//Adding id in array from main list
    return res.concat(answers);//Using contact method for add both arrays values 
  }, []);

  return result.sort(function(a, b) {
    return a - b;
  });
}


console.log(getIDs(data));

Answer 5

Answer №3

Give this code a shot

Your JSON data: myData = { ... }

let output = []
let objects = []
for (let x = 0; x < myData.comments.length; x++){
    let objId = myData.comments[x].id
    output.push(objId)
    objects.push(myData.comments[x].answers)
}
for(let y = 0; y < objects.length; y ++){
    let answersList = objects[y]
    for(let z = 0; z < answersList.length; z++){
        let answer = answersList[z]
        if(answer)             
            output.push(answer.id)
    }
}
console.log(output)

Answer 6

Give this code a shot

Your JSON data: myData = { ... }

let output = []
let objects = []
for (let x = 0; x < myData.comments.length; x++){
    let objId = myData.comments[x].id
    output.push(objId)
    objects.push(myData.comments[x].answers)
}
for(let y = 0; y < objects.length; y ++){
    let answersList = objects[y]
    for(let z = 0; z < answersList.length; z++){
        let answer = answersList[z]
        if(answer)             
            output.push(answer.id)
    }
}
console.log(output)

Ways to retrieve a list of identifiers from arrays at both initial and subsequent levels

Answer №1

Answer №2

Answer №3

Similar questions

I'm having trouble with installing nx as it keeps showing the error message 'Platform Dependency for NX is Missing.'

Unable to make getJSON function properly with CodeIgniter

Replace the JS function in the bundle with a new custom function

removing a property from an object using AngularJS

What is the best way to show a tooltip alongside highlighted text?

When the jQuery document is ready, it typically returns null, but the console can still access and display

Passing an array of ID's between two components in Angular: A comprehensive guide

Arranging data using jqGrid's Inline Editing Feature

Populate an ASP Form using Javascript in Android Studio

Receiving a null value in Action after an AJAX call in Struts 2

Jquery Visualization Chart not displaying

What is the best way to send multiple variables to a url using jQuery ajax?

Looking for guidance on how to specify the angular direction in the ng-repeat

Error: Issue with parsing integer in JavaScript

configure dynamic content within the slider element

Error: JavaScript encountered an unterminated string literal issue

Not all words are compatible with word-wrap, don't you think?!

Chess.js TypeScript declaration file for easy implementation

Including a Pinterest image hover widget following the completion of an Ajax load

The method for storing a user's choice in my array and subsequently selecting an element at random