Open3

JavaScriptでの Sort 系の操作について

ピン留めされたアイテム
まさぴょんまさぴょん

JavaScriptでの sort 関数による昇順・降順 Sort の基本

const numberList = [1, 30, 4, 21, 100000];

/** 昇順・Sort */
const ascNumberList = numberList.sort((a, b) => a - b);
console.log("ascNumberList", ascNumberList); // ascNumberList (5) [1, 4, 21, 30, 100000]
console.log("numberList(元配列)", numberList); // numberList(元配列) (5) [1, 4, 21, 30, 100000]

/** 降順・Sort */
const descNumberList = numberList.sort((a, b) => b - a);
console.log("descNumberList", descNumberList); // descNumberList (5) [100000, 30, 21, 4, 1]
console.log("numberList(元配列)", numberList); // numberList(元配列) (5) [100000, 30, 21, 4, 1]

https://masanyon.com/javascript-array-list-sort-tosorted-asc-desc/

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

まさぴょんまさぴょん

日付で Sort する

/**
 * NOTE: 並び替え Box (Sort Select Box)
 * 1. 最新登録順
 *    - create_time で 送付先リストを Sort する
 *    - Default値
 * 2. あいうえお順
 *    - 都道府県 を基準に あいうえお順 で Sort する
 *    - 都道府県名の先頭文字を取得して、それを基準に Sort する
 */
const addressList = [
  {
    user_id: "1000020339",
    city: "渋谷区",
    full_name: "ロボ ロボ玉",
    address_line1: "",
    address_line2: null,
    building: "",
    district: "ハチ公前",
    first_name: "ロボ玉",
    last_name: "ロボ",
    input_type: 2,
    post_code: "136-0072",
    phone_number: "1111111111",
    user_address_id: 1000020357,
    province: "東京都",
    create_time: "2024-01-24T08:00:33.472Z",
    update_time: null,
    default: false,
  },
  {
    user_id: "1000020339",
    city: "桐生市",
    full_name: "白桃 さん",
    address_line1: "メゾン白桃",
    address_line2: null,
    building: "",
    district: "広沢町",
    first_name: "さん",
    last_name: "白桃",
    input_type: 2,
    post_code: "136-0072",
    phone_number: "1111111111",
    user_address_id: 1000020358,
    province: "群馬県",
    create_time: "2024-01-24T08:07:23.560Z",
    update_time: null,
    default: true,
  },
  {
    user_id: "1000020339",
    city: "上尾市",
    full_name: "ぷる たま",
    address_line1: "",
    address_line2: null,
    building: "",
    district: "東大宮",
    first_name: "たま",
    last_name: "ぷる",
    input_type: 2,
    post_code: "136-0072",
    phone_number: "1111111111",
    user_address_id: 1000020365,
    province: "埼玉県",
    create_time: "2024-01-25T09:30:47.730Z",
    update_time: null,
    default: false,
  },
];

/** 最新登録順(昇順) で、Sortされた配列 */
const timeSortListAsc = [];

// 最新登録順(昇順): addressList の create_time を基準に Sort して timeSortList に pushする
addressList
  .sort((a, b) => {
    return a.create_time > b.create_time ? -1 : 1;
  })
  .forEach((address) => {
    timeSortListAsc.push(address);
  });
console.log("最新登録順(昇順)", timeSortListAsc);

console.log("--------------------------");

/** 古い順(降順) で、Sortされた配列 */
const timeSortListDesc = [];

// 古い順(降順): addressList の create_time を基準に Sort して timeSortList に pushする
addressList
  .sort((a, b) => {
    return a.create_time < b.create_time ? -1 : 1;
  })
  .forEach((address) => {
    timeSortListDesc.push(address);
  });
console.log("古い順(降順)", timeSortListDesc);

https://mebee.info/2022/09/07/post-76508/

https://qiita.com/maiamea/items/4ab60364c4c268eaa2a5

https://step-learn.com/article/javascript/205-sort-date.html

まさぴょんまさぴょん

JavaScriptのsort関数で日本語を50音順に並べるにはどうすればいいのか?

  • 日本語の50音順にソートしたい場合は、localeCompareIntl.Collatorsort()と合わせて、利用します。

https://qiita.com/eiji-noguchi/items/af1e125932e9be19d069

https://blog.kimizuka.org/entry/2021/06/03/121459#google_vignette

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Intl/Collator