What is a pure function? When is a function considered pure? What are side effects?
Frontend
Given the following code snippet: ```typescript let info = { name: "Alex", skill: ["git", "react", "read"], }; let started = (info: any) => { let { name, skill } = info; (name = "Alex Pool"), skill.push("delete"); return { name, skill, online: true, }; }; ``` Explain what the function `started` does with the `info` object and describe the output of calling `started(info)`. Also, discuss if the original `info` object is mutated after calling `started(info)`.
How was code review conducted in your team? Was there a regulation? What did you pay attention to?
Tell about the critical stages of browser rendering.
Are parameters passed to the function by reference or by value?
Is HTML and CSS parsing done sequentially or in parallel?
Tell me about the event loop: what is it for, how does it work?
What is the pseudo-array arguments? How does it differ from a regular array?
What is recursion? What are its rules? What is it used for?
What is React Reconciliation? How does it work? What criteria does React use to decide whether to update or remount a component?
When are useEffect and useLayoutEffect called?
Have you configured CI/CD pipelines, linters, prettier, pre-commit hooks — did you do it yourself or was it assigned from above?
// Promise.resolve() // .then(() => console.log(1)) // // .then(() => console.log(2)) // // Promise.resolve() // .then(() => console.log(11)) // // .then(() => console.log(22)) //
Tell me about yourself and your work experience
What has changed in React 18 during the Reconciliation process?
function recursiveFunction(N) { let counter = 0; if (N > 0) { counter = counter + 1; recursiveFunction(N - 1); } // console.log(counter) } recursiveFunction(3); // 3 3 3 ? Explain what the output of the function will be and why. Also, identify any issues with the current implementation of the recursive function and suggest how to fix it to correctly count and log the number of recursive calls.
Why is React needed? What problems does it solve? When is it excessive?
import "./styles.css"; import React from "react"; const getData = () => { return Array.from({ length: 50 }, (el, idx) => ({ value: Math.random(), label: `row ${idx + 1}`, })); }; export default function App() { const [data, setData] = React.useState(getData()); const handleUpdate = () => { setData((prev) => { return prev.map((row, i) => i === 0 ? { ...row, value: Math.random() } : row ); }); }; return ( <div> <h1>List App</h1> <Button onClick={handleUpdate}>update `row 1`</Button> {data.map((row) => { return <Row key={row.label} label={row.label} value={row.value} />; })} </div> ); }
Emotion and styled-components generate styles at runtime — is this a problem? When does it start to hurt? What are the alternatives with better performance?
What will be the output of the following code snippet? ```javascript setTimeout(() => { console.log('B') }, 0) Promise.resolve().then(() => { console.log('C') }) Promise.resolve().then(() => { console.log('D') }) console.log('E') ```