js sort tricks All In One

js sort tricks All In One

js 排序技巧

const arr = [
    { label: 'False 1 ❌', disabled: false, },
    { label: 'False 2 ❌', disabled: false },
    { label: 'Ture 1 ✅', disabled: true, },
    { label: 'False 3 ❌', disabled: false, },
    { label: 'Ture 2 ✅', disabled: true, },
    { label: 'Ture 3 ✅', disabled: true, },
    { label: 'False 4 ❌', disabled: false, },
];

// JSON.stringify(arr, null, 4);


const subTableList = () => {
    // sort 排序裏面的函數意思是 按照 disabled 屬性(先 false 後 true) 的方式排序, 並按照索引的先後順序不變
    const temp = [...arr];
    // log(`\ntemp 1`, temp);
    // return temp.sort((a, b) => (a.disabled ^ b.disabled ? 1 : 0) * (a.disabled ? 1 : -1));
    return temp.sort((a, b) => (a.disabled ^ b.disabled) * a.disabled);
    // return temp.sort((a, b) => (a.disabled ^ b.disabled) * +a.disabled);
}

const MapList = () => {
    const temp = [...arr];
    // log(`\ntemp 2`, temp);
    // const result = new Map();
    const result = [];
    for (let i = 0; i < temp.length; i++) {
        const item = temp[i];
        if(!item.disabled) {
            result.push(item);
        } else {
            result.unshift(item);
        }
    }
    return result;
    // return temp.map((a, b) => (a.disabled ^ b.disabled ? 1 : 0) * (a.disabled ? 1 : -1));
    // return temp.sort((a, b) => (a.disabled ^ b.disabled ? 1 : 0) * (a.disabled ? 1 : -1));
}

const log = console.log;


log(`subTableList =\n`, subTableList());


log(`\nMapList =\n`, MapList());


/* 

node map.js
subTableList =
 [ { label: 'False 1 ❌', disabled: false },
  { label: 'False 2 ❌', disabled: false },
  { label: 'False 3 ❌', disabled: false },
  { label: 'False 4 ❌', disabled: false },
  { label: 'Ture 1 ✅', disabled: true },
  { label: 'Ture 2 ✅', disabled: true },
  { label: 'Ture 3 ✅', disabled: true } ]

MapList =
 [ { label: 'Ture 3 ✅', disabled: true },
  { label: 'Ture 2 ✅', disabled: true },
  { label: 'Ture 1 ✅', disabled: true },
  { label: 'False 1 ❌', disabled: false },
  { label: 'False 2 ❌', disabled: false },
  { label: 'False 3 ❌', disabled: false },
  { label: 'False 4 ❌', disabled: false } ]
  
*/

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

js ^ operator

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_XOR


const a = 1;        // 00000000000000000000000000000001
const b = 3;        // 00000000000000000000000000000011

console.log(a ^ b); // 00000000000000000000000000000010
// 2

// ^ 異或, 11 的 0, 01,10 的 1,00 的 0

1 * true;
1
1 * false;
0

0 * true;
0
0 * false;
0


(false ^ true);
1
(true ^ false);
1

(false ^ false);
0
(true ^ true);
0

(false ^ true) * false;
1
(false ^ true) ^ true;
0

!false;
true
!!false;
false

!true;
false
!!true;
true

+false;
0
-false;
-0

+true;
1
-true;
-1

refs



©xgqfrms 2012-2020

www.cnblogs.com 發佈文章使用:只允許註冊用戶纔可以訪問!


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章