Irbisa · Шпаргалка
JavaScript для React
Замыкания, области видимости, this, прототипы, сравнение, event loop, промисы и async/await, модули, иммутабельность, методы массивов
Чем отличаются
var,letиconstи что такое temporal dead zone?function demo() { console.log(a); // undefined: var is hoisted and initialized // console.log(b); // ReferenceError: b is in the temporal dead zone var a = 1; let b = 2;…Чем отличаются
==и===в JavaScript?Чем примитивные типы отличаются от ссылочных в JavaScript?
Чем
nullотличается отundefined?Что такое замыкание и где замыкания встречаются в React?
function createCounter() { let count = 0; // captured by the closures below return { increment: () => ++count, get: () => count, };…Что выведет этот код и как сделать, чтобы он вывел 0, 1, 2?
for (var i = 0; i < 3; i++) { setTimeout(() => { console.log(i); }, 0);}Что выведет этот код и почему объявление функции можно вызвать до его строки, а функциональное выражение нельзя?
console.log(greet());console.log(typeof hello); function greet() { return 'hi';} var hello = function () { return 'hello';}; console.log(hello());console.log(wave()); var wave = () => 'wave';Что делают деструктуризация, spread и rest, optional chaining
?.и nullish coalescing???const settings = { volume: 0, theme: null, user: { name: 'Ada' } }; const { volume, theme = 'light', ...others } = settings;console.log(volume, theme); // 0 null: the default applies only to undefinedconsole.log(others); // { user: { name: 'Ada' } }…Какие методы массивов чаще всего используются в React-коде и какие из них мутируют массив?
const cart = [ { id: 1, title: 'Book', price: 12 }, { id: 2, title: 'Pen', price: 2 }, { id: 3, title: 'Lamp', price: 30 },];…Чем поверхностная копия отличается от глубокой и как сделать каждую?
const user = { name: 'Ada', address: { city: 'London' } }; const shallow = { ...user };shallow.address.city = 'Paris';console.log(user.address.city); // Paris: the nested object is shared…Как определяется
thisв JavaScript и чем отличаются стрелочные функции?const user = { name: 'Ada', greet() { return `Hi, ${this.name}`; }, greetLater() {…Как работает прототипное наследование и что к нему добавляет ключевое слово
class?class Animal { constructor(name) { this.name = name; } speak() { return `${this.name} makes a sound`;…Чем именованный экспорт отличается от экспорта по умолчанию и чем ES-модули отличаются от CommonJS?
// math.jsexport const PI = 3.14159;export function area(r) { return PI * r * r;}export default function round(n) {…Что такое Promise и как с ним связаны
async/await?async function loadUser(id) { try { const response = await fetch(`/api/users/${id}`); if (!response.ok) throw new Error(`HTTP ${response.status}`); return await response.json(); } catch (error) {…В чём разница между
Promise.all,Promise.allSettled,Promise.raceиPromise.anyи когда какой из них использовать?const ok = (value, ms) => new Promise((resolve) => setTimeout(() => resolve(value), ms));const fail = (reason, ms) => new Promise((_, reject) => setTimeout(() => reject(new Error(reason)), ms)); const results = await Promise.allSettled([ok('profile', 50), fail('feed down', 10)]);console.log(results.map((r) => r.status)); // ['fulfilled', 'rejected']…Как обрабатывать ошибки в коде с
async/awaitи что происходит с отклонённым промисом, который никто не поймал?async function loadDashboard(userId) { showSpinner(); try { // Promise.all attaches a handler to both requests at once const [profile, orders] = await Promise.all([ fetchJson(`/api/users/${userId}`),…Как работает event loop в JavaScript: что такое стек вызовов, микрозадачи и макрозадачи?
В каком порядке этот код выведет значения и почему?
console.log('1'); setTimeout(() => console.log('2'), 0); Promise.resolve().then(() => console.log('3')); (async () => { console.log('4'); await null; console.log('5');})(); console.log('6');Найдите баг:
saveAllвыводит «done» раньше, чем сохранён хоть один пользователь.async function saveAll(users) { users.forEach(async (user) => { await saveUser(user); }); console.log('done');}Как реализовать
debounceи когда использовать его вместоthrottle?function debounce(fn, delay) { let timerId; function debounced(...args) { clearTimeout(timerId); timerId = setTimeout(() => fn.apply(this, args), delay); }…Что вызывает утечки памяти в одностраничном React-приложении и как их найти?