如何在 JavaScript 中的对象对象中获取 Top 5 和 Lowest 5 值？

Question

给定一个看起来像这样的对象：

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
      }
    }

我想获取5个最高值和5个最低值的键和值。

我首先尝试通过执行以下操作来获取 abilities 对象内每个对象中的最高整数值：

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)
});

这会打印出内部对象的名称和整个子对象本身。

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

但是，maxval 没有提供任何与 Max 相关的信息。

我该如何解决我的任务？

Answer 1

如果只想要五个最高值和五个最低值，则按降序提取值和sort，提取最高和最低五个值。

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; }

你也可以使用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; }