Frontend

Ποιες στατικές μεθόδους του Promise γνωρίζεις; Μίλησέ μου γι' αυτές.

Middle+

IT One

Τι είναι το Set; Τι μπορούμε να περάσουμε όταν καλούμε το new Set ως όρισμα;

Middle+

IT One

Γράψτε μια συνάρτηση getUserProfile που παίρνει ένα userId ως όρισμα και λαμβάνει το προφίλ χρήστη από το API endpoint "[link]". Η συνάρτηση θα πρέπει να καταγράφει το προφίλ χρήστη αν η ανάκτηση είναι επιτυχής, και να καταγράφει ένα μήνυμα σφάλματος αν η ανάκτηση αποτύχει.

Middle+

IT One

import React, { useState, useEffect, useLayoutEffect } from 'react'; export default () => { const [count, setCount] = useState(0); useLayoutEffect(() => console.log("fiecare randare 1")); console.log("fiecare randare 2"); useEffect(() => console.log("fiecare randare 3")); return ( <button onClick={() => setCount((prevProps) => ++prevProps)}> Crește </button> ); } // montare -> fiecare randare 2, fiecare randare 1, fiecare randare 3 // actualizare -> fiecare randare 2, fiecare randare 1, fiecare randare 3 // demontare 4

Middle+

IT One

Ανυψώνονται τα let και const (hoisting); Τι συμβαίνει όταν προσπαθούμε να τα προσπελάσουμε πριν από την δήλωσή τους;

Middle+

IT One

const S = { id: 1, όνομα: "Ivan", ηλικία: "39", tel: [phone] }; function getParam(obj, key) { return obj[key]; } getParam(S, "tel"); getParam(S, "job");

Middle+

IT One

Γράψτε μια αφηρημένη υλοποίηση του συστατικού Child με memoization μέσω React.memo. Ποιο είναι το δεύτερο επιχείρημα που δέχεται το React.memo;

Middle+

IT One

Γράψτε τι θα συμβεί κατά την πρώτη απόδοση — σε ποια σειρά θα εμφανιστούν τα console.log. Τι θα συμβεί μετά το κλικ;

Middle+

IT One

Τι είναι το WeakSet;

Middle+

IT One

import React, { useState, useEffect, useRef, useContext, useReducer, useMemo } from 'react'; const someFunc = (arr) => { return [...arr].sort((a, b) => a - b); }; const LazyInit = (props) => { const [arr, setArr] = useState(() => someFunc(props.arr)); const onClick = () => { setArr((prev) => prev.concat(prev.length + 1)) } return ( <> <button onClick={onClick}> Αυξήστε </button> <ul> {arr.map((n, index) => <li key={index}>{n}</li>)} </ul> </> ) } export default () => <LazyInit arr={[1, 2, 3]} />; --- Η συζήτηση στα δεξιά καλύπτει: - Χρήση TypeScript με γενικούς τύπους: "<T extends object, K extends keyof T>" - Έλεγχο αν τα δεδομένα είναι string με τύπο guard: "isString(data: unknown): data is string { ... }" - Χρήση του useState με μια λειτουργία για να αποφευχθεί η επανεκτέλεση σε κάθε render: ``` const [state, setState] = useState(getComplexData); // ή const [state, setState] = useState(() => getComplexData()); ``` - Η λειτουργία που περνάει στο useState θα τρέξει μόνο μία φορά κατά την αρχική φόρτωση. - Προειδοποίηση σχετικά με την άμεση μετατροπή της κατάστασης στη γραμμή 11 με prev.concat. --- Ο τεχνικός στόχος είναι να αναλύσει και ενδεχομένως να διορθώσει ή να βελτιστοποιήσει τον κώδικα του React component, εστιάζοντας σε: - Ορθή lazy αρχικοποίηση της κατάστασης με useState. - Αποφυγή άμεσης μεταβολής της κατάστασης. - Κατανόηση των γενικών τύπων του TypeScript και των guards τύπων. - Διασφάλιση ότι το component ενημερώνει σωστά την κατάσταση όταν πατάει το κουμπί.

Middle+

IT One

Τι είναι το κλείσιμο;

Middle+

IT One

Υπάρχουν τρεις πηγές δεδομένων που επιστρέφουν την ίδια πληροφορία. Πώς να λάβετε την απάντηση από την πιο γρήγορη;

Middle+

IT One

Ποια είναι η διαφορά μεταξύ Map και WeakMap;

Middle+

IT One

Μίλησέ μου για το hook useState στο React.

Middle+

IT One

Γιατί δεν μπορούμε να χρησιμοποιήσουμε τον κατασκευαστή new με τις βελάκια;

Middle+

IT One

Πώς δημιουργούνται οι συναρτήσεις στη JavaScript; Ποιοι είναι οι τρόποι δημιουργίας συναρτήσεων και πώς διαφέρουν;

Middle+

IT One

Ποιους βοηθητικούς τύπους TypeScript χρησιμοποιείτε στη δουλειά σας; Μιλήστε για Record, Pick, Omit, Partial, Required, Parameters, Exclude, Extract.

Middle+

IT One