Filter object by id and find highest score

Question

I am trying to find the correct syntax for sorting an object by id and then finding the highest score for that id array. I have sorted the object so far to this point with conditionals and the sort() method but I want to condense the object to the highest score by lesson_id. What am I missing?

Heres what Im getting at this point so far:

    34: {user: 6, lesson_id: 2, score: 50, complete: true}
    35: {user: 6, lesson_id: 1, score: 50, complete: true}
    36: {user: 6, lesson_id: 2, score: 50, complete: true}
    38: {user: 6, lesson_id: 2, score: 100, complete: true}
    39: {user: 6, lesson_id: 2, score: 100, complete: true}
    40: {user: 6, lesson_id: 2, score: 100, complete: true}

But I want it like this:

    0: {user: 6, lesson_id: 2, score: 100, complete: true}
    1: {user: 6, lesson_id: 1, score: 50, complete: true}

Heres what Ive got so far (Vue3.js):

    mounted() {
      this.quizArray = response.data;
      const arrayFilter = this.quizArray;
      const user_id = this.user_profile[0]["id"];
      var newObj = [];
      var listSort = function () {
        for (var i = 0; i < arrayFilter.length; i++) {
          if (arrayFilter[i].student["id"] === user_id) {
            if (arrayFilter[i].score !== null) {
              if (arrayFilter[i].complete === true) {
                arrayFilter.sort((a, b) => a.score - b.score);
                //not sure about this part ....
                newObj[i] = {
                  user: arrayFilter[i].student["id"],
                  lesson_id: arrayFilter[i].quiz["lesson_id"],
                  score: arrayFilter[i].score,
                  complete: arrayFilter[i].complete
                }
              }
            }
          }
        }
      };
      newObj = this.filteredResults; 
            console.log(this.filteredResults)
      listSort();
      
      // const highest = this.filteredResults.sort((a, b) => b.score - a.score)[0]
      // console.log(highest) works but only for one lesson
     });
    },

Here's the original object:

35:
complete: true
quiz: {id: 1, lesson_id: 1, question: 'What is heat transfer?', answer: 'Its is a type of blah', op1: 'Its balahsdd', …}
score: 50
student: {user: 'Mark', name: 'Mark', occupation: 'Commissioning Technician', residence: 'Australia', active_id: false, …}

user_7690344 · Answer

I would suggest to utilize JS methods for this, it would clean up the code. Also I don't see the point of sorting the array, if you just need the highest value you can use the snippet below. @EDIT I forgot about the grouping per lesson, updated the answer below

const userId = this.user_profile[0]["id"];

// get all completed quiz elements for student and with score different than null
const quizForStudent = this.quizArray.filter(quiz => quiz.student.id === userId && quiz.complete && quiz.score !== null)

// find highest value for all lessons
// const highest = quizForStudent.reduce((prev, current) => prev.score > current.score ? prev : current)

// group elements per lesson id. this will give result in format
// {
//     2: [{complete: true, quiz: {lesson_id: 2, ...}, score: 100, student: {...}, {complete: true, quiz: {lesson_id: 2, ...}, score: 100, student: {...}, ...]
//     1: [{complete: true, quiz: {lesson_id: 1, ...}, score: 100, student: {...}]
// }
const scorePerLesson = quizForStudent.reduce((object, current) => {
    // make sure array exist for given lessonId
    object[current.quiz.lesson_id] = object[current.quiz.lesson_id] || []
    // add array to object
    object[current.quiz.lesson_id].push(current)

    return object
},{})

// find highest score for each lesson
// {
//     2: {complete: true, quiz: {lesson_id: 2, ...}, score: 100, student: {...}
//     1: {complete: true, quiz: {lesson_id: 1, ...}, score: 100, student: {...}
// }
const highestScorePerLesson = Object.entries(scorePerLesson).reduce((object, [lessonId, quiz]) => ({
    ...object,
    [lessonId]: quiz.reduce((prev, current) => prev.score > current.score ? prev : current)
}), {})

To get the highest score for given lesson (for example lesson 2) you can use

highestScore[2]

Check out in sandbox: link

user_8695156 · Answer

Array.reduce can be used for this:

const quizArray = [
    {user: 6, lesson_id: 2, score: 50, complete: true},
    {user: 6, lesson_id: 1, score: 50, complete: true},
    {user: 6, lesson_id: 2, score: 50, complete: true},
    {user: 6, lesson_id: 2, score: 100, complete: true},
    {user: 6, lesson_id: 2, score: 100, complete: true},
    {user: 6, lesson_id: 2, score: 100, complete: true}
];

let highScores = Object.values(quizArray
    .filter(entry => entry.complete) // Only consider completed entries
    .reduce((highScores, entry) => {
        // Look up current high score for this lesson
        let lesson = highScores[entry.lesson_id];
        // If there is no score, or the new score is higher, then switch in new entry
        if (!lesson || (entry.score > lesson.score)) { highScores[entry.lesson_id] = entry; }
        return highScores;
    }, {}));

console.log(highScores);

Filter object by id and find highest score

2 Answers