Tema
/
Interneto svetainių kliento dalies kūrimas JS
📖 Teorija

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.