javascriptreactjsarraysremix

Returning Null from Array.map() function


I am trying to get data from a JS object by using array.map() function. However, the output I am getting is null. I am not able to understand the problem here.

This is the object

export const Course = [
  {
    course_id: "001-TTE-ADIT",
    course_description:"XXXX",
    course_title: "XXXX",
    course_faculty: "XXXX",
    course_duration: "XXXX",
    course_lectures_count: "XXXX",
    course_fees: XXXX,
    course_section: [
      {
        section_id: "001-TTE-ADIT-S01",
        section_name: "XXXX",
        section_description:
          "TXXXX.",
        section_duration: 3,
        section_lecture_count: 3,
        section_lectures: [
          {
            lecture_id: "001-TTE-ADIT-S01-LE01",
            lecture_name: "XXXX",
            lecture_description:
              "XXXX.",
            lecture_faculty: "XXXX",
            lecture_duration: 1,
            lecture_link: "#",
            lecture_notes: [
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
            ],
          },
          {
            lecture_id: "001-TTE-ADIT-S01-LE02",
            lecture_name: "XXXX",
            lecture_description:
              "XXXX.",
            lecture_faculty: "XXXX",
            lecture_duration: 0.5,
            lecture_link: "#",
            lecture_notes: [
              {
                note_title: "XXXX",
                note_link: "#",
              },
            ],
          },
        ],
      },
      {
        section_id: "001-TTE-ADIT-S02",
        section_name: "XXXX",
        section_description:
          "XXXX",
        section_duration: 5,
        section_lecture_count: 5,
        section_lectures: [
          {
            lecture_id: "001-TTE-ADIT-S00-LE03",
            lecture_name: "XXXX",
            lecture_description:
              "XXXX",
            lecture_faculty: "XXXX",
            lecture_duration: 1,
            lecture_link: "#",
            lecture_notes: [
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
            ],
          },
          {
            lecture_id: "001-TTE-ADIT-S00-LE04",
            lecture_name: "XXXX",
            lecture_description:
              "XXXX",
            lecture_faculty: "XXXX",
            lecture_duration: 1,
            lecture_link: "#",
            lecture_notes: [
              {
                note_title: "XXXX",
                note_link: "#",
              },
            ],
          },
          {
            lecture_id: "001-TTE-ADIT-S00-LE05",
            lecture_name: "XXXX",
            lecture_description:
              "XXXX",
            lecture_faculty: "XXXX",
            lecture_duration: 1,
            lecture_link: "#",
            lecture_notes: [
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
              {
                note_title: "XXXX",
                note_link: "#",
              },
            ],
          },
        ],
      },
    ],
  },
];

And this is the function for getting data from object

import { Course } from "../../Data/Courses";

export const getListLectures = async () => {
  let lecture_list = [];

  lecture_list = Course.map((course) => {
    course.course_section?.map((section) => {
      section.section_lectures?.map((lecture) => {
        lecture_list.push(lecture?.lecture_name);
      });
    });
  });

  return lecture_list;
};

The expected outcome from this function was list of lectures which lie within each section for the given course.


Solution

  • You can use a mix of map and flatMap - making sure you return each mapped array each time.

    For the purposes of this example:

    1. I've changed Course to courses to better match the data description
    2. I had to change the value of course_fees to zero
    3. I changed the names of the lectures so you can better understand the output.

    const courses=[{course_id:"001-TTE-ADIT",course_description:"XXXX",course_title:"XXXX",course_faculty:"XXXX",course_duration:"XXXX",course_lectures_count:"XXXX",course_fees:0,course_section:[{section_id:"001-TTE-ADIT-S01",section_name:"XXXX",section_description:"TXXXX.",section_duration:3,section_lecture_count:3,section_lectures:[{lecture_id:"001-TTE-ADIT-S01-LE01",lecture_name:"1111",lecture_description:"XXXX.",lecture_faculty:"XXXX",lecture_duration:1,lecture_link:"#",lecture_notes:[{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"}]},{lecture_id:"001-TTE-ADIT-S01-LE02",lecture_name:"2222",lecture_description:"XXXX.",lecture_faculty:"XXXX",lecture_duration:.5,lecture_link:"#",lecture_notes:[{note_title:"XXXX",note_link:"#"}]}]},{section_id:"001-TTE-ADIT-S02",section_name:"XXXX",section_description:"XXXX",section_duration:5,section_lecture_count:5,section_lectures:[{lecture_id:"001-TTE-ADIT-S00-LE03",lecture_name:"3333",lecture_description:"XXXX",lecture_faculty:"XXXX",lecture_duration:1,lecture_link:"#",lecture_notes:[{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"}]},{lecture_id:"001-TTE-ADIT-S00-LE04",lecture_name:"4444",lecture_description:"XXXX",lecture_faculty:"XXXX",lecture_duration:1,lecture_link:"#",lecture_notes:[{note_title:"XXXX",note_link:"#"}]},{lecture_id:"001-TTE-ADIT-S00-LE05",lecture_name:"5555",lecture_description:"XXXX",lecture_faculty:"XXXX",lecture_duration:1,lecture_link:"#",lecture_notes:[{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"},{note_title:"XXXX",note_link:"#"}]}]}]}];
    
    const lectureNames = courses.flatMap(course => {
      return course.course_section.flatMap(section => {
        return section.section_lectures.map(lecture => {
          return lecture.lecture_name;
        });
      });
    });
    
    console.log(lectureNames);