Frontend

6420

Въпроси6420

Повдигат ли се let и const (hoisting)? Какво се случва, когато към тях се обръщаме преди декларацията им?

Middle+

IT One

133

Каква е разликата между await p1, await p2 и Promise.all([p1, p2])?

Middle+

IT One

133

Кои статични методи на Promise познаваш? Разкажи ми за тях.

Middle+

IT One

132

const S = { id: 1, име: "Ivan", възраст: "39", tel: [phone] }; function getParam(obj, key) { return obj[key]; } getParam(S, "tel"); getParam(S, "job");

Middle+

IT One

131

import React, { useState, useEffect, useLayoutEffect } from 'react'; export default () => { const [count, setCount] = useState(0); useLayoutEffect(() => console.log("всякий раз 1")); console.log("всякий раз 2"); useEffect(() => console.log("всякий раз 3")); return ( <button onClick={() => setCount((prevProps) => ++prevProps)}> Növel </button> ); } // монтаж -> всякий раз 2, всякий раз 1, всякий раз 3 // обновление -> всякий раз 2, всякий раз 1, всякий раз 3 // демонтаж 4

Middle+

IT One

131

Какво е Set? Какво можем да предаваме, когато извикваме new Set като аргумент?

Middle+

IT One

131

Какво е затваряне?

Middle+

IT One

130

Напишете какво ще се случи при първото рендериране — в какъв ред ще се покажат console.log-овете. Какво ще стане след кликването?

Middle+

IT One

129

Напишете абстрактна реализация на компонента Child с мемоизация чрез React.memo. Какъв е вторият аргумент, който приема React.memo?

Middle+

IT One

128

Какво е WeakSet?

Middle+

IT One

128

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>" - Проверка дали данните са низ с помощта на типова защита: "isString(data: unknown): data is string { ... }" - Използване на useState с функция, за да се избегне повторното изпълнение при всеки рендер: ``` const [state, setState] = useState(getComplexData); // или const [state, setState] = useState(() => getComplexData()); ``` - Функцията, предадена на useState, ще се изпълни само веднъж при монтиране на компонента. - Предупреждение за директна мутация на състоянието на ред 11 с prev.concat. --- Техническата задача е да се анализира и евентуално да се поправи или оптимизира React компонентният код, като се фокусира върху: - Правилната ленивата инициализация на състоянието с useState. - Избягване на директна мутация на състоянието. - Разбиране на генериците на TypeScript и тип защитниците. - Осигуряване, че компонентът актуализира състоянието правилно при кликване на бутона.

Middle+

IT One

126

Каква е разликата между Map и WeakMap?

Middle+

IT One

122

Има три източника на данни, които връщат една и съща информация. Как да получите отговора от най-бързия?

Middle+

IT One

119

Разкажи ми за hook-а useState в React.