Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

141
Views
Map over nested array but return an array of the numbers in React

Following on from this question

I would like to return the point?.value as an array of numbers, I have tried let data = point?.value + 1

So far my code is:

Data structure:

export const testData = [
  {
    "date": [
      "2016-09-0912:00:00",
      "2015-09-0913:10:00"
    ],
    "title": [
      {
        "name": 'Name 1',
        "description": [
          {
            "value": 7898
          },
          {
            "value": 7898
          }
        ]
      },
      {
        "name": 'Name 2',
        "description": [
          {
            "value": 3244
          },
          {
            "value": 4343
          }
        ]
      },
      {
        "name": 'Name 3',
        "description": [
          null,
          null
        ]
      }
    ]
  }
]

map function:

 <div style={{ color: 'white' }}>
Hello
{testData.map(inner => {
  return (
    <p style={{color: 'white'}}>{inner.title.map(inside => {
      return (
      inside.description.map(point => {
        return (
          point?.value
        )
      })
      )
    })}</p>
  )
})}
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

You can use Array.prototype.flatMap():

The flatMap() method returns a new array formed by applying a given callback function to each element of the array, and then flattening the result by one level.

const testData = [
  {
    date: ["2016-09-0912:00:00", "2015-09-0913:10:00"],
    title: [
      {
        name: "Name 1",
        description: [{ value: 7898 }, { value: 7898 }],
      },
      {
        name: "Name 2",
        description: [{ value: 3244 }, { value: 4343 }],
      },
      {
        name: "Name 3",
        description: [null, null],
      },
    ],
  },
];

const output = testData
  .flatMap((inner) => {
    return inner.title.flatMap((inside) =>
      inside.description.map((point) => point?.value)
    );
  })
  .filter((v) => typeof v !== "undefined");
console.log("output: ", output);  

Result:

output:  [ 7898, 7898, 3244, 4343 ]
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!