【JavaScript】連想配列から特定keyのvalueだけの、並び替えた配列を取得する

ソースコード

// 連想配列
const animalObjs = [
  { id: 1, animal: "tiger" },
  { id: 2, animal: "cat" },
  { id: 3, animal: "pig" },
  { id: 4, animal: "bird" },
  { id: 5, animal: "dog" },
];

// animalの順番オブジェクト
const animalOrderConfigObjs = [
  { order: 1, animal: "pig" },
  { order: 2, animal: "dog" },
  { order: 3, animal: "cat" },
];

// 連想配列からanimalだけ取得した配列
const animalsArray = animalObjs.map((obj) => obj.animal);

// animalsArrayから重複削除
const animalsArrayUnique = [...new Set(animalsArray)];

// animalOrderConfigObjsを並び替える
animalOrderConfigObjs.sort(function (x, y) {
  return (
    animalsArrayUnique.indexOf(x.order) - animalsArrayUnique.indexOf(y.order)
  );
});

// 並び替えたcanimalOrderConfigObjsのanimalだけ取得
const orderedAnimalsArray = animalOrderConfigObjs.map((odr) => odr.animal);

// orderedAnimalsArrayとanimalsArrayUniqueの差分を取得
const unorderedAnimalsArray = animalsArrayUnique.filter(
  (i) => orderedAnimalsArray.indexOf(i) == -1
);

// orderedAnimalsArrayとunorderedAnimalsArrayを結合（animalOrderConfigObjs通りの順番→残りはanimalObjs通りの順番になる）
const animals = [...orderedAnimalsArray, ...unorderedAnimalsArray];

参考リンク

• 配列内の特定条件の値群のみ先頭 or 末尾に集める並び替え
• 【JavaScript】連想配列の重複データを削除する
• sort メソッドで文字列を任意の順番でソート

個人用blogにも書いた

メモくらい適当にアウトプットしているblogにも書いたのですが、使う機会あるかもしれないので、
こっちにもそのまま書きます。