How do i return an Array from a nested Array JavaScript/React

Question

Im trying to get a list of individual tags from the below but i keep getting undefined. What am i doing wrong?

initialState = [{name: "John",tags: ["primary", "secondary"]}, {name: "Mark",tags: ["primary"]}];

let tags = initialState.forEach((el) => {
  if (el.tags) {
    el.tags.map((tag) => {
      return tag;
    }, []);
  }
})
console.log(tags);

Expected Result

tags = ["primary","secondary","primary"]

Array.prototype.forEach doesn't return anything. Your inner map is also an useless expression statement, because the return is immediately discarded. — ASDFGerte
– ASDFGerte, Commented Mar 11, 2021 at 18:02

Majed Badawi · Accepted Answer · 2021-03-11 18:04:42Z

1

.forEach doesn't return an array. To get all the tags in one list, you can use .flatMap as follows:

const initialState = [
  { name: "John", tags: ["primary", "secondary"] },
  { name: "Mark", tags:["primary"] }
];

const tags = initialState.flatMap(({ tags = [] }) => tags);   

console.log(tags);

answered Mar 11, 2021 at 18:04

Majed Badawi

28.5k4 gold badges30 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Randy Casburn · Accepted Answer · 2021-03-11 18:06:02Z

0

Or, alternatively to the other answer using map() and then flat()

initialState = [{name: "John",tags: ["primary", "secondary"]}, {name: "Mark",tags: ["primary"]}];

let tags = initialState.map(el=>[...el.tags]).flat();
console.log(tags);

answered Mar 11, 2021 at 18:06

Randy Casburn

14.2k1 gold badge19 silver badges32 bronze badges

Collectives™ on Stack Overflow

How do i return an Array from a nested Array JavaScript/React

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related