(JavaScript) Find same value in different arrays of objects-CodePudding

I am making a courses card component in the React app. I have two arrays with the data to fill these cards.

THE COURSES ARRAY OF OBJECTS:

const courses = [
    {
        id: 'de5aaa59-90f5-4dbc-b8a9-aaf205c551ba',
        title: 'JavaScript',
        description: `Lorem Ipsum is simply dummy text of the printing and
    typesetting industry. Lorem Ipsum
    has been the industry's standard dummy text ever since the
    1500s, when an unknown
    printer took a galley of type and scrambled it to make a type
    specimen book. It has survived
    not only five centuries, but also the leap into electronic typesetting, remaining essentially u
    nchanged.`,
        creationDate: '8/3/2021',
        duration: 160,
        authors: [
            '27cc3006-e93a-4748-8ca8-73d06aa93b6d',
            'f762978b-61eb-4096-812b-ebde22838167',
        ],
    },
    {
        id: 'b5630fdd-7bf7-4d39-b75a-2b5906fd0916',
        title: 'Angular',
        description: `Lorem Ipsum is simply dummy text of the printing and
    typesetting industry. Lorem Ipsum
    has been the industry's standard dummy text ever since the
    1500s, when an unknown
    printer took a galley of type and scrambled it to make a type
    specimen book.`,
        creationDate: '10/11/2020',
        duration: 210,
        authors: [
            'df32994e-b23d-497c-9e4d-84e4dc02882f',
            '095a1817-d45b-4ed7-9cf7-b2417bcbf748',
        ],
    },
];

THE AUTHORS ARRAY OF OBJECTS:

const authors = [
    {
        id: '27cc3006-e93a-4748-8ca8-73d06aa93b6d',
        name: 'Vasiliy Dobkin',
    },
    {
        id: 'f762978b-61eb-4096-812b-ebde22838167',
        name: 'Nicolas Kim',
    },
    {
        id: 'df32994e-b23d-497c-9e4d-84e4dc02882f',
        name: 'Anna Sidorenko',
    },
    {
        id: '095a1817-d45b-4ed7-9cf7-b2417bcbf748',
        name: 'Valentina Larina',
    },
];

MY TRIES TO MATCH AND "DE-HASH" THE AUTHORS:

const COURSE = props.value;
    // AUTHOR = authors.find((el) => el.id === COURSE.authors[0]);
    // const filteredArray = array1.filter(value => array2.includes(value));
    // arrA.filter(x => arrB.includes(x));
    const authorsDeHash = (authorsHashed, authors) => {
        // const myarr = [];
        for (let i of authorsHashed) {
            // console.log(authorsHashed);
            console.log(authors.find((el) => el.id === authorsHashed[i]));
            // myarr.push(authors.find((el) => el.id === authorsHashed[i]));
        }
    };
    authorsDeHash(COURSE.authors, authors);

UPD: since I'm already passing a ONE single course from the parent component, I don't need to search for the value in entire "courses" array. So basically I have just to find authors real names for a one course.

CodePudding user response：

I used a for loop and the Array.prototype.find() function. Please see snippet below.

const courses = [
    {
        id: 'de5aaa59-90f5-4dbc-b8a9-aaf205c551ba',
        title: 'JavaScript',
        description: `Lorem Ipsum is simply dummy text of the printing and
    typesetting industry. Lorem Ipsum
    has been the industry's standard dummy text ever since the
    1500s, when an unknown
    printer took a galley of type and scrambled it to make a type
    specimen book. It has survived
    not only five centuries, but also the leap into electronic typesetting, remaining essentially u
    nchanged.`,
        creationDate: '8/3/2021',
        duration: 160,
        authors: [
            '27cc3006-e93a-4748-8ca8-73d06aa93b6d',
            'f762978b-61eb-4096-812b-ebde22838167',
        ],
    },
    {
        id: 'b5630fdd-7bf7-4d39-b75a-2b5906fd0916',
        title: 'Angular',
        description: `Lorem Ipsum is simply dummy text of the printing and
    typesetting industry. Lorem Ipsum
    has been the industry's standard dummy text ever since the
    1500s, when an unknown
    printer took a galley of type and scrambled it to make a type
    specimen book.`,
        creationDate: '10/11/2020',
        duration: 210,
        authors: [
            'df32994e-b23d-497c-9e4d-84e4dc02882f',
            '095a1817-d45b-4ed7-9cf7-b2417bcbf748',
        ],
    },
];
const authors = [
    {
        id: '27cc3006-e93a-4748-8ca8-73d06aa93b6d',
        name: 'Vasiliy Dobkin',
    },
    {
        id: 'f762978b-61eb-4096-812b-ebde22838167',
        name: 'Nicolas Kim',
    },
    {
        id: 'df32994e-b23d-497c-9e4d-84e4dc02882f',
        name: 'Anna Sidorenko',
    },
    {
        id: '095a1817-d45b-4ed7-9cf7-b2417bcbf748',
        name: 'Valentina Larina',
    },
];
const COURSE = courses[0]
    const authorsDeHash = (authorsHashed, authors) => {
        for (let i = 0; i < authorsHashed.length; i  ) {
          let author = authors.find(e => e.id === authorsHashed[i]);
          console.log(author.name)
        }
    };
    authorsDeHash(COURSE.authors, authors);

CodePudding user response：

const authorsMap = authors.reduce((acc, author) => ({ ...acc, [author.id]: author.name }), {}); // it faster to find a value in a Map than searching in Array

const coursesWithAuthors = courses
.map(course => ({ ...course, authors: course.authors.map(id => authorsMap[id]) }));

CodePudding user response：

I can't really find anything wrong with the code you have. But you can easily get an array of author names using Array.map like:

console.log(
    COURSE.authors.map(authorId => authors.find(a => a.id === authorId) ?? "--") //default value in case, a match isn't found in authors array.
)