Question 305880 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – How to make a flat array with a specific sequence?

I have a nested array, but I need to make a flat array from this array, but so that everything goes one by one

const data = [
  {
    titles: [
      {
        id: 1,
        name: "Title 01",
        subtitles: [
          {
            id: 2,
            name: "Subtitle 01",
            title_id: 1,
            content: [
              {
                id: 3,
                name: "Content 01",
                subtitle_id: 2,
              },
            ],
          },
        ],
      },
      {
        id: 4,
        name: "Title 01",
        subtitles: [
          {
            id: 5,
            name: "Subtitle 01",
            title_id: 4,
            content: [
              {
                id: 6,
                name: "Content 01",
                subtitle_id: 5,
              },
            ],
          },
        ],
      },
    ],
  },
]

Need

const flatArr = [
  {
    titles01: {
      name: "Title 01",
      id: 1,
    },
    sutitles01: {
      name: "Subtitle 01",
      id: 2,
      title_id: 1,
    },
    content01: {
      id: 3,
      name: "Content 01",
      subtitle_id: 2,
    },
    titles02: {
      name: "Title 02",
      id: 4,
    },
    sutitles02: {
      name: "Subtitle 02",
      id: 5,
      title_id: 4,
    },
    content02: {
      id: 6,
      name: "Content 02",
      subtitle_id: 5,
    },
  },
]

That is, so that the array is flat and everything goes one by one, start with title01, then subtitle01, then content01, then title02, then sibtitle02, then content02, so that there is such a hierarchy, is this even possible? Unfortunately, I don’t have any code examples because nothing worked…

Tags:

2

Answers


  1. 0

    Here is the solution:

        let titles = {}
data.forEach((item, key) => {
  item.titles.forEach(title => {
    if (title.id < 10) {

      titles = {
        ...titles,
        ['titles0' + title.id]: {name: title.name, id: title.id}
      }

    } else {
      titles = {
        ...titles,
        ['titles' + title.id]: {name: title.name, id: title.id}
      }
    }

    title.subtitles.forEach(subtitle => {
      if (title.id < 10) {
        titles = {
          ...titles, ['subtitles0' + subtitle.id]: {
            id: subtitle.id,
            name: subtitle.name,
            title_id: subtitle.title_id,
          }
        }
      } else {
        titles = {
          ...titles, ['subtitles' + subtitle.id]: {
            id: subtitle.id,
            name: subtitle.name,
            title_id: subtitle.title_id,
          }
        }
      }

      subtitle.content.forEach(content => {
        if (title.id < 10) {
          titles = {
            ...titles,
            ['content0' + content.id]:
              {
                name: content.name,
                id: content.id,
                subtitle_id: content.subtitle_id
              }
          }
        } else {
          titles = {
            ...titles,
            ['content' + content.id]:
              {
                name: content.name,
                id: content.id,
                subtitle_id: content.subtitle_id
              }
          }
        }
      })
    })

  })
})

console.log('flatArr', [titles])
    Login or Signup to reply.
  2. 0

    Here is a function that can give you desired result as above

    const transformArray = (data) => {

    return data.reduce((result, topLevelItem, index) => {

    const titlesKey = `titles${index + 1}`;
const subtitlesKey = `subtitles${index + 1}`;
const contentKey = `content${index + 1}`;

result[titlesKey] = {
  name: topLevelItem.titles[0].name,
  id: topLevelItem.titles[0].id,
};

result[subtitlesKey] = {
  name: topLevelItem.titles[0].subtitles[0].name,
  id: topLevelItem.titles[0].subtitles[0].id,
  title_id: topLevelItem.titles[0].subtitles[0].title_id,
};

result[contentKey] = {
  id: topLevelItem.titles[0].subtitles[0].content[0].id,
  name: topLevelItem.titles[0].subtitles[0].content[0].name,
  subtitle_id: topLevelItem.titles[0].subtitles[0].content[0].subtitle_id,
};

return result;

    }, {});
    };

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search