How to get Top 5 and Lowest 5 values in an object of objects in JavaScript?

Question

Given an object that looks like this:

let abilities =  {
      "technical": {
        "Corners": 12,
        "Crossing": 12,
        "Dribbling": 20,
        "Finishing": 14,
        "First Touch": 17,
        "Free Kick": 13,
        "Heading": 7,
        "Long Shots": 11,
        "Long Throws": 5,
        "Marking": 3,
        "Passing": 15,
        "Penalty Taking": 19,
        "Tackling": 4,
        "Technique": 18
      },
      "mental": {
        "Aggression": 8,
        "Anticipation": 12,
        "Bravery": 17,
        "Composure": 15,
        "Concentration": 13,
        "Decisions": 16,
        "Determination": 15,
        "Flair": 18,
        "Leadership": 6,
        "Off The Ball": 14,
        "Positioning": 7,
        "Teamwork": 9,
        "Vision": 16,
        "Work Rate": 12
      },
      "physical": {
        "Acceleration": 17,
        "Agility": 20,
        "Balance": 16,
        "Jumping Reach": 8,
        "Natural Fitness": 16,
        "Pace": 16,
        "Stamina": 17,
        "Strength": 11
      }
    }

I want to get the keys and values of the 5 highest and 5 lowest values.

I first tried to get the top integer value in each object inside the abilities object by doing:

Object.keys(abilities).forEach(key => {
  let value = abilities[key];
  console.log(key)
  console.log(value)
  let maxval = Object.keys(abilities).reduce((a, b) => abilities[a] > abilities[b] ? a : b);
  console.log(maxval)
});

This prints out the name of the inner objects and the entire sub-object itself.

> technical
> {Corners: 12, Crossing: 12, Dribbling: 20, Finishing: 14, First Touch: 17, ...}

However, the maxval doesn't give anything related to the Max.

How may I solve my task?

What exactly is the expected output, do you want an array or object or something for both the mins and maxes for each outer key (like technical and mental)? — CertainPerformance
– CertainPerformance, Commented Jul 1, 2019 at 0:21
Given the object like that, I am expecting something like: top = {"Dribbling": 20, "Agility": 20, "Penalty Taking": 19, "Technique": 18, "Flair": 18} and 'low = {"Marking": 3, "Tackling": 4, "Long Throws": 5, "Leadership": 6, "Heading": 7}` Separating into two functions is also fine. It's the top 5 and lowest 5 abilities among all objects. — Dawn17
– Dawn17, Commented Jul 1, 2019 at 0:26

Jack Bashford · Accepted Answer · 2019-07-01 06:23:47Z

6

If you just want the five highest values and five lowest values, extract the values and sort in descending order, extracting the highest and lowest five values.

let abilities = {"technical":{"Corners":12,"Crossing":12,"Dribbling":20,"Finishing":14,"First Touch":17,"Free Kick":13,"Heading":7,"Long Shots":11,"Long Throws":5,"Marking":3,"Passing":15,"Penalty Taking":19,"Tackling":4,"Technique":18},"mental":{"Aggression":8,"Anticipation":12,"Bravery":17,"Composure":15,"Concentration":13,"Decisions":16,"Determination":15,"Flair":18,"Leadership":6,"Off The Ball":14,"Positioning":7,"Teamwork":9,"Vision":16,"Work Rate":12},"physical":{"Acceleration":17,"Agility":20,"Balance":16,"Jumping Reach":8,"Natural Fitness":16,"Pace":16,"Stamina":17,"Strength":11}};

const sortedValues = Object.values(abilities).flatMap(Object.entries).sort(([, a], [, b]) => b - a);

const fiveHighest = sortedValues.slice(0, 5);
const fiveLowest = sortedValues.slice(-5);

console.log(fiveHighest);
console.log(fiveLowest);

.as-console-wrapper { max-height: 100% !important; top: auto; }

You can also make the two-dimensional arrays into objects using reduce:

let abilities = {"technical":{"Corners":12,"Crossing":12,"Dribbling":20,"Finishing":14,"First Touch":17,"Free Kick":13,"Heading":7,"Long Shots":11,"Long Throws":5,"Marking":3,"Passing":15,"Penalty Taking":19,"Tackling":4,"Technique":18},"mental":{"Aggression":8,"Anticipation":12,"Bravery":17,"Composure":15,"Concentration":13,"Decisions":16,"Determination":15,"Flair":18,"Leadership":6,"Off The Ball":14,"Positioning":7,"Teamwork":9,"Vision":16,"Work Rate":12},"physical":{"Acceleration":17,"Agility":20,"Balance":16,"Jumping Reach":8,"Natural Fitness":16,"Pace":16,"Stamina":17,"Strength":11}};

const sortedValues = Object.values(abilities).flatMap(Object.entries).sort(([, a], [, b]) => b - a);

const fiveHighest = sortedValues.slice(0, 5).reduce((a, [k, v]) => ({ ...a, [k]: v }), {});
const fiveLowest = sortedValues.slice(-5).reduce((a, [k, v]) => ({ ...a, [k]: v }), {});

console.log(fiveHighest);
console.log(fiveLowest);

.as-console-wrapper { max-height: 100% !important; top: auto; }

edited Jul 1, 2019 at 6:23

answered Jul 1, 2019 at 0:26

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

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

5 Comments

Dawn17 Over a year ago

Is there also a way to get the name of the key with the number?

Jack Bashford Over a year ago

Sure @Dawn17 - one second.

Jack Bashford Over a year ago

Is that what you want @Dawn17?

Dawn17 Over a year ago

Yes, that's great! Thank you so much.

Jack Bashford Over a year ago

No problem @Dawn17, always glad to help.

Collectives™ on Stack Overflow

How to get Top 5 and Lowest 5 values in an object of objects in JavaScript?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related