Abėcėliniai masyvai, objektai ir objektų masyvai CSS-gudrybės

Turinys

Masyvas:

let fruits = (`bananas`, `Apples`, `Oranges`);

Jūs galite rūšiuoti taip abėcėlės tvarka:

fruits.sort();

Tačiau atkreipkite dėmesį į nenuoseklų masyvo didžiųjų raidžių raidę ... didžiosios raidės bus surūšiuotos prieš mažąsias (pakankamai keista), todėl bus šiek tiek sudėtingiau:

let fruits = (`bananas`, `Apples`, `Oranges`); fruits.sort((a, b) => ( return a.toLowerCase().localeCompare(b.toLowerCase()); )) console.log(fruits); // ("Apples", "bananas", "Oranges")

Objektų masyvas

Viskas dar sudėtingiau, jei tai, ką bandote rūšiuoti, yra įdėta į objektus. Lengvai gali būti atvejis dirbant su JSON API.

let fruits = ( ( fruit: `Bananas` ), ( fruit: `apples` ), ( fruit: `Oranges` ) );

Tam galėtume sukurti pasirinktinę rūšiavimo funkciją, tačiau dar šiek tiek reikia padaryti bendresnę funkciją, pagal kurią raktas būtų rūšiuojamas kaip param.

const propComparator = (propName) => (a, b) => a(propName).toLowerCase() == b(propName).toLowerCase() ? 0 : a(propName).toLowerCase() < b(propName).toLowerCase() ? -1 : 1

Taigi dabar galime jį naudoti rūšiuoti:

fruits.sort(propComparator(`fruit`)); console.log(fruits); /* ( (fruit: "apples"), (fruit: "Bananas"), (fruit: "Oranges") ) */

Tiesiog objektas

Jei mes tiesiog turime daiktą ...

let fruits = ( Bananas: true, apples: false, Oranges: true );

Mums vis tiek reikia mažinti tuos raktus, bet mes galime surūšiuoti raktų masyvą ir tada pagaminti naują objektą iš to naujai išrūšiuoto raktų masyvo.

let sortedFruits = (); Object.keys(fruits).sort((a, b) => ( return a.toLowerCase().localeCompare(b.toLowerCase()); )).forEach(function(key) ( sortedFruits(key) = fruits(key); )); console.log(sortedFruits); /* ( apples: false, Bananas: true, Oranges: true ) */

Objektų masyvas, kurį reikia rūšiuoti pagal raktą

let fruits = ( ( Bananas: true ), ( Apples: false ), ( oranges: true ) );

Tai tikriausiai sudėtingiausia iš visų, tačiau aukščiau turėtų būti pakankamai informacijos, kad ją sutvarkytumėte. Paimk.

Tiesioginis kodas

Žr. Chriso Coyier'io (@chriscoyier) rašiklių abėcėlinius masyvus „CodePen“.

Įdomios straipsniai...