Frontend

Sous quel format reçois-tu les tâches ? Quel degré d'autonomie ?

Quelles sont les principales balises HTML que tu connais?

Parlez-moi un peu de vous et de votre expérience la plus intéressante.

Parlez-moi de vous et de votre expérience professionnelle.

Implémentez la fonction debounce(fn, delay), qui retarde l'appel de la fonction jusqu'à ce que le délai de silence spécifié soit écoulé.

Implémenter une classe selon le pattern Observateur (Observer / Event Emitter) : stockage des abonnés, abonnement à un événement, désabonnement d'un événement, notification des abonnés.

Tu as mentionné les tests — as-tu écrit des tests chez [entreprise] et dans ton dernier emploi?

Implémentez la classe EventEmitter : la méthode subscribe(event, handler) pour s'abonner à un événement et la méthode emit(event, data) pour appeler tous les abonnés. Implémentez également la méthode unsubscribe.

Comment avez-vous résolu le problème de coexistence d'une nouvelle pile et de code Legacy dans un seul projet ? Avez-vous envisagé des micro-frontend ou des composants web ?

Implémenter la fonction debounce.

As-tu de l'expérience dans la migration de Vue 2 à Vue 3 — qu'as-tu exactement fait toi-même?

Implémenter le défilement virtuel : il y a une longue liste de messages (10 000 éléments), il faut rendre uniquement les éléments visibles dans un conteneur de hauteur fixe de 300px, avec une hauteur de ligne de 30px.

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: supprimer le gestionnaire } function emit(event, payload) { // TODO: appeler tous les abonnés de l'événement } 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);

Sous quel format reçois-tu les tâches ? As-tu un haut degré d'autonomie ?

Exercice pratique : travailler avec deux tableaux d'objets — comparaison par clé en utilisant des structures Map et parcours avec deux boucles

As-tu de l'expérience dans l'écriture de tests ? Quels types de tests as-tu écrits et en quelle quantité ?

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) => { // écrivez le code ici return fn(...args); }; // et ici return wrapped; }

Pourquoi avez-vous conclu qu'il fallait un kit UI personnalisé, plutôt que d'utiliser simplement des éléments d'une UI prête à l'emploi?

Implémentez une liste virtuelle (Virtual List) : il y a une longue liste de messages, il faut rendre uniquement les éléments visibles à l'intérieur d'un conteneur d'une hauteur fixe de 300 pixels. La hauteur d'une ligne est de 30 pixels.

Parlez-moi de votre expérience professionnelle pertinente.