Write a function getUserProfile that takes a userId as an argument and fetches the user profile from the API endpoint "[link] The function should log the user profile if the fetch is successful, and log an error message if the fetch fails.
What static methods of Promise do you know? Tell about them.
import React, { useState, useEffect, useLayoutEffect } from 'react'; export default () => { const [count, setCount] = useState(0); useLayoutEffect(() => console.log("each render 1")); console.log("each render 2"); useEffect(() => console.log("each render 3")); return ( <button onClick={() => setCount((prevProps) => ++prevProps)}> Increment </button> ); } // mount -> each render 2, each render 1, each render 3 // update -> each render 2, each render 1, each render 3 // unmount 4
What is a Set? What can we pass when calling new Set as an argument?
Do let and const (hoisting) pop up? What happens when you access them before declaration?
const S = { id: 1, name: "Ivan", age: "39", tel: [phone] }; function getParam(obj, key) { return obj[key]; } getParam(S, "tel"); getParam(S, "job");
Write an abstract implementation of a Child component with memoization using React.memo. What is the second argument that React.memo accepts?
Write what will happen during the first render — in what order will console.logs appear? What happens after clicking?
What is WeakSet?
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}> Increment </button> <ul> {arr.map((n, index) => <li key={index}>{n}</li>)} </ul> </> ) } export default () => <LazyInit arr={[1, 2, 3]} />; --- The conversation on the right side discusses: - Using TypeScript with generics: "<T extends object, K extends keyof T>" - Checking if data is a string with a type guard: "isString(data: unknown): data is string { ... }" - Using useState with a function to avoid re-running on every render: ``` const [state, setState] = useState(getComplexData); // or const [state, setState] = useState(() => getComplexData()); ``` - The function passed to useState will run only once on component mount. - Warning about mutating state directly on line 11 with prev.concat. --- The technical task is to analyze and possibly fix or optimize the React component code, especially focusing on: - Proper lazy initialization of state with useState. - Avoiding direct mutation of state. - Understanding TypeScript generics and type guards. - Ensuring the component updates state correctly on button click.
What is a closure?
There are three data sources returning the same information. How to get the response from the fastest one?
What is the difference between Map and WeakMap?
If you refer to the arguments argument in an arrow function, what will be there?
Tell me about the useState hook in React.
How are functions created in JavaScript? What are the ways to create functions and how do they differ?
Why can't arrow functions be used with the new constructor?
What utility types of TypeScript do you use in your work? Tell me about Record, Pick, Omit, Partial, Required, Parameters, Exclude, Extract.
