Javascript sorting an object using an index

Question

I have an array of dictionary objects that looks like

  [0: Object {key: "Bags_Under_Eyes", value: Array(600)}
  1: Object {key: "Black_Hair", value: Array(600)}
  2: Object {key: "Blond_Hair", value: Array(600)}
  3: Object {key: "Eyeglasses", value: Array(600)}
  4: Object {key: "Gray_Hair", value: Array(600)}
  5: Object {key: "Heavy_Makeup", value: Array(600)}
  6: Object {key: "High_Cheekbones", value: Array(600)}
  7: Object {key: "Male", value: Array(600)}
  8: Object {key: "Mouth_Slightly_Open", value: Array(600)}
  9: Object {key: "Smiling", value: Array(600)}
  10: Object {key: "Wearing_Lipstick", value: Array(600)}
  11: Object {key: "Young", value: Array(600)}]

I need to index them using an array of keys, which is a separate object. Let's say that this array looks like the following,

  [0: "Heavy_Makeup"
  1: "Bags_Under_Eyes"
  2: "Wearing_Lipstick"
  3: "Black_Hair"
  4: "Male"
  5: "Young"
  6: "High_Cheekbones"
  7: "Smiling"
  8: "Blond_Hair"
  9: "Gray_Hair"
  10: "Mouth_Slightly_Open"
  11: "Eyeglasses"]

I cannot figure out how to sort using two different objects. Is there a simple solution to this?

score 1 · Answer 1 · answered Jun 17 '21 at 13:40

You can use sort() and findIndex()

const obj = [
  { key: "Bags_Under_Eyes" },
  { key: "Black_Hair" },
  { key: "Blond_Hair" },
  { key: "Eyeglasses" },
  { key: "Gray_Hair" },
  { key: "Heavy_Makeup" },
  { key: "High_Cheekbones" },
  { key: "Male" },
  { key: "Mouth_Slightly_Open" },
  { key: "Smiling" },
  { key: "Wearing_Lipstick" },
  { key: "Young" },
];

const seq = [
  "Heavy_Makeup",
  "Bags_Under_Eyes",
  "Wearing_Lipstick",
  "Black_Hair",
  "Male",
  "Young",
  "High_Cheekbones",
  "Smiling",
  "Blond_Hair",
  "Gray_Hair",
  "Mouth_Slightly_Open",
  "Eyeglasses",
];

obj.sort((a, b) => {
  const indexA = seq.findIndex(s => s === a.key);
  const indexB = seq.findIndex(s => s === b.key);
  return indexA - indexB;
});

console.log(obj);

Samathingamajig · Answer 2 · 2021-06-17T13:50:36.350

You can just sort via Array.prototype.sort based off of Array.prototype.indexOf of the key of each object in the sortBy array;

const data = [{key:"Bags_Under_Eyes",value:Array(1)},{key:"Black_Hair",value:Array(1)},{key:"Blond_Hair",value:Array(1)},{key:"Eyeglasses",value:Array(1)},{key:"Gray_Hair",value:Array(1)},{key:"Heavy_Makeup",value:Array(1)},{key:"High_Cheekbones",value:Array(1)},{key:"Male",value:Array(1)},{key:"Mouth_Slightly_Open",value:Array(1)},{key:"Smiling",value:Array(1)},{key:"Wearing_Lipstick",value:Array(1)},{key:"Young",value:Array(1)}];

const sortBy = ["Heavy_Makeup",
  "Bags_Under_Eyes",
  "Wearing_Lipstick",
  "Black_Hair",
  "Male",
  "Young",
  "High_Cheekbones",
  "Smiling",
  "Blond_Hair",
  "Gray_Hair",
  "Mouth_Slightly_Open",
  "Eyeglasses",
];

const sortedData = data.sort((a, b) => sortBy.indexOf(a.key) - sortBy.indexOf(b.key));

display(sortedData);


function display(json, query) {
  const pre = document.createElement("pre");
  pre.innerText = JSON.stringify(json, null, 2);

  document.querySelector("body").appendChild(pre);
}

html,
body {
  background: whitesmoke;
}

pre {
  color: black;
  background: white;
  border: 3px solid black;
  border-radius: 1rem;
  padding: 1rem;
}

Javascript sorting an object using an index

2 Answers2