【JavaScript】配列の並び替え【ソートではない】

配列の並び替えで検索するとソート(sort)の記事が多くヒットします。 しかし、「ちがうんや。任意の位置に移動して並べ替えたいんや」という時もありますね。 sort ではなく reorder の並び替えです。 そのコードを書いたのでログとして記載します。

/**
 * 元の配列を書き換えない並べ替え
 * 
 * @param {array}  array - 並べ替える配列
 * @param {number} from  - 並べ替える要素のindex番号
 * @param {number} to    - 並べ替え先のindex番号
 */
function reorderArray(array, from, to) {
  const copyArray = array.slice(); // シャローコピーの新しい配列
  const element = copyArray[from];
  copyArray.splice(from, 1);
  copyArray.splice(to, 0, element);
  return copyArray;
}

// サンプル配列
const users = [
  { name: '山田', age: 18},
  { name: '田中', age: 28},
  { name: '鈴木', age: 38},
  { name: '杉原', age: 48},
  { name: '池田', age: 58}
];

// 先頭の要素(index:0)を4番目(index:3)に並べ替える
const reordered = reorderArray(users, 0, 3);

// 並び替え元の配列(変化なし)
console.log(users);
// console log
// [
//   { name: '山田', age: 18},
//   { name: '田中', age: 28},
//   { name: '鈴木', age: 38},
//   { name: '杉原', age: 48},
//   { name: '池田', age: 58}
// ];

// 並び替えた後の配列(シャローコピーなので参照は同じ)
console.log(reordered);
// console log
// [
//   { name: '田中', age: 28},
//   { name: '鈴木', age: 38},
//   { name: '杉原', age: 48},
//   { name: '山田', age: 18},
//   { name: '池田', age: 58}
// ];

人気記事すべて表示

WEBすべて表示