Lentelė kaip išvestinis būsenos vaizdas
Turim mėgstamiausius (9 pamoka). Dabar parodykim juos kaip kolekcijos lentelę — su rikiuojamais stulpeliais, puslapiavimu ir paieška. Tai pirmoji funkcija, pilnai pastatyta ant 9 pamokos pub/sub: lentelė skaito getState(), o veiksmai (rikiuok, puslapiuok) kviečia notify(), ir lentelė persipiešia pati.
Esminė mintis: lentelė yra išvestinis būsenos vaizdas. Nesaugom „surikiuoto sąrašo" ar „dabartinio puslapio" atskirai — juos apskaičiuojam iš būsenos kiekvieno perpiešimo metu:
favorites ──filtruok(paieška)──▶ ──rikiuok(stulpelis, kryptis)──▶ ──slice(puslapis)──▶ eilutės
Trys operacijos, visada ta pačia tvarka: filtruok → rikiuok → supjaustyk. Jei tvarką sukeisi (pvz. supjaustysi prieš filtruodamas), puslapių skaičiai „plaukios". Todėl kiekviena iš getFilteredFavorites() grąžina paruoštą sąrašą, o renderCollection tik atpjauna puslapį.
Trys valdikliai:
- Rikiavimas. Paspaudi stulpelio antraštę — rikiuoja pagal jį; paspaudi tą patį dar kartą — apverčia kryptį (asc ↔ desc).
- Puslapiavimas.
Math.ceil(rows.length / pageSize)puslapių;slice(start, start + pageSize)atpjauna dabartinį. - Paieška. Per pavadinimą, pastabas IR žymas.
Ir vienas klastingas spąstas laukia rikiuojant — Array.sort() elgiasi ne taip, kaip tikiesi.