Frontend

V akom formáte ti prichádzajú úlohy? Aká je tvoja miera samostatnosti?

Aké základné HTML tagy poznáte?

Povedz mi niečo o sebe a o svojej najzaujímavejšej skúsenosti.

Porozprávaj mi o sebe a svojom pracovnou skúsenostiou.

Implementujte funkciu debounce(fn, delay), ktorá odkladá volanie funkcie do uplynutia zadaného času ticha.

Implementujte triedu podľa vzoru Observer (Observer / Event Emitter): ukladanie odberateľov, odber na udalosť, odhlásenie od udalosti, oznámenie odberateľov.

Spomenuli ste testy — písali ste testy v [spoločnosť] a na poslednom pracovisku?

Implementujte triedu EventEmitter: metódu subscribe(event, handler) na odber udalosti a metódu emit(event, data) na volanie všetkých odberateľov. Taktiež implementujte metódu unsubscribe.

Ako ste riešili problém s koexistenciou novej zásobníka a legacy kódu v jednom projekte? Zvažovali ste mikro-frontendy alebo webové komponenty?

Máš skúsenosti s migráciou z Vue 2 na Vue 3 — čo si presne robil sám?

Implementovať funkciu debounce.

Implementovať virtuálne rolovanie: existuje dlhý zoznam správ (10 000 prvkov), je potrebné renderovať iba viditeľné prvky vnútri kontajnera s pevnou výškou 300px, s výškou riadku 30px.

V akom formáte prichádzajú úlohy k tebe? Máš vysokú mieru samostatnosti?

function createEmitter() { const events = new Map(); function on(event, handler) { if(!events.has(event)) { events.set(event, [handler]) return } events.get(event).push(handler) } function off(event, handler) { // TODO: odstrániť handler } function emit(event, payload) { // TODO: zavolať všetkých odberateľov udalosti } return { on, off, emit }; } const bus = createEmitter(); const unsub1 = bus.on("order:created", (payload) => { console.log("handler1:", payload.id); }); const handler2 = (payload) => { console.log("handler2:", payload.id); } bus.on("order:created", handler2);

Praktická úloha: práca so dvomi poľami objektov — porovnanie podľa kľúča pomocou štruktúr Map a prechádzanie dvoma slučkami

Máš skúsenosti s písaním testov? Aké testy si písal a v akom rozsahu?

function memoize(fn, options = {}) { const { maxSize = 1000, keyOf = (...a) => JSON.stringify(a), lruTouch = true, } = options; let hits = 0; let misses = 0; const cache = new Map(); const getKey = (...args) => keyOf(...args); const wrapped = (...args) => { // napiš kód sem return fn(...args); }; // a tu return wrapped; }

Prečo ste prišli k záveru, že je potrebný vlastný UI-kit, a nie len použiť prvky hotového UI?

Implementujte virtuálny zoznam (Virtual List): existuje dlhý zoznam správ a je potrebné renderovať iba viditeľné prvky vnútri kontajnera s pevnou výškou 300 pixelov. Výška jedného riadku je 30 pixelov.

Povedz mi o svojej relevantnej pracovnej skúsenosti.