【JavaScript】配列にあるオブジェクトの順番を変える

はじめに

バックエンドからjsonをもらったが、{{XXX}}などは使わず、フロント側でオブジェクトの順番を変えたいといったことがあったので、備忘録

表示したい配列

const array = [
  {
     name: "fogefoge",
     type: "fugafuga",
     age: 10,
     birthday: 2020/02/02
  },
  {
     name: "fogefoge"
     type: "fugafuga",
     age: 20,
     birthday: 2022/02/22
  },
  ...
]

コード①

はじめに、オブジェクトのキーを表示したい順序で配列に定義します。

const order = ['name', 'birthday', 'type', 'age']

次に、newArrayを空配列で定義し、for文でorderのkeyを一つずつ入れていきます。

const newArray = [];

for (let i = 0; i < array.length; i++) {
 newArray.push(order.map(x => {
  return array[i][x]
 }))
}

コード②

ただ、上記のやり方だと値がオブジェクトの場合や、文字列を改行させたい場合に長くなるので、
その場合はarray自体をmapし、任意の順番に要素を並べる方が綺麗にまとまります。

const newArray = array.map(x => {
 name: x.name,
 birthday: x.birthday
 type: x.type,
 age: x.age
})