Телеграм канал «Кодовая база»

Правильный ответ: синхронно с 1 выведутся 2, create callback for: 3 и create callback for: 4, 5.
И еще 3 выведется асинхронно, в микротаске:


1
2
create callback for: 3
create callback for: 4
5
// -- async microtask
3


Давайте разбираться, почему так.
То, что promise executor — это синхронный код и поэтому 2 выведется в общем потоке, многие из вас знают. Но мало кто знает, что функции then и catch также вызовутся синхронно! Колбеки, которые они создадут, вызовутся асинхронно (или не вызовутся вообще, если колбек не подходящий, например, в нашем случае не вызовется catch), но создадутся они синхронно! Причем создадутся оба колбека — для состояний fullfilled и rejected, потому что Javascript не может знать заранее, чем там наш промис завершится. А вот создадутся все колбеки и создадутся они синхронно.

Итого, синхронны: обычные вызовы console.log, конструкция promise executor, вызовы then и catch. Асинхронен вызов колбека, который был создан в then. Колобке, который был вызван в catch, не вызовется.

🔜 Канал в MAX

#event_loop

В прошлом посте обсудили синхронный код, а теперь поговорим о том, как это связано с промисами. Но для начала задачка. Посмотрите на код ниже и скажите, какие логи будут вызваны синхронно относительно console.log(1)?


console.log(1);

const createCb = (n) => {
console.log("create callback for: ", n);
return () => console.log(n);
}

new Promise((res) => {
console.log(2);
res();
})
.then(createCb(3))
.catch(createCb(4))

console.log(5);


🔜 Канал в MAX

#event_loop

🔂Что такое синхронный код

Если спросить вас, как работает event loop в браузере, то большинство ответит, что event loop сначала выполняет синхронный код, затем макротаску из очереди, после чего всего микротаски. Такой ответ устроит интервьюера, но, строго говоря, точным не является.

Возможно, я вас удивлю, но в спецификации, как и в документации mdn, нет никакого упоминания про “синхронный код”. (Больше вам скажу, там даже макротасок нет). В спеке упоминаются таски (которые мы называем макротасками) и микротаски. Они ведут себя так, как описано выше: сначала выполняется таска, затем все готовые к выполнению микротаски, затем из очереди берется новая таска.

Так что же такое “синхронный код”? Что вообще значит “синхронный”? С точки зрения mdn, синхронный код — это код, который последовательно выполняется один за другим без задержек. Например, в этом коде

f();
g();

после выполнения f управление сразу, незамедлительно, перейдет к g, поэтому f и g синхронны относительно друг друга.

Теперь давайте посмотрим на код ниже.

f();

function later() {
m();
n();
}

setTimeout(later);

Большинство из вас скажут, что later — это макротаска и это верно, но не точно. Функция later действительно является макротаской, которая встанет в очередь через 0мс и будет выполнена сразу же, как движок освободится, но что насчет функций m и n, которые она вызывает? Когда later попадет в колстек и начнет исполняться, то m и n будут выполнены сразу друг за другом, незамедлительно, следовательно, это синхронный код. То есть m и n синхронны относительно друг друга, а относительно функции f уже асинхронны.

📌Таким образом, синхронный код — это относительное понятие, то есть не свойство кода как такового, а его отношение к другому коду. Код синхронен, когда он был порожден одной таской/микротаской.

🔜 Канал в MAX

#event_loop

Как собеседовать программистов в 2026

Прочла на днях вот такой пост про разочарование от нанятого сотрудника. Напишу лайфхаки, которыми на собеседованиях фронтенд-разработчиков пользуюсь лично я для того, чтобы отделить настоящие навыки от тех, которые просто заявлены в резюме.

📌Предусловие

Чтобы найти толкового фронтенд-разработчика, нужно самому хорошо разбираться в разработке фронтенда. Если вы разбираетесь поверхностно, то мои советы не сработают. В наши дни у кандидата есть великолепный арсенал в виде тщательно подготовленной ментором легенды, ИИ оверлея и слитых в интернет записей собесов. У вас будет только опыт, интеллект и интуиция, и если что-то из этого вас подводит, то развитие событий будет не в вашу пользу.

〰️ До собеседования 〰️

🟣Изучаем резюме. Ищем:

1️⃣ Явные логические противоречия и бессмыслицу. Например, “использовал WebSocket для REST API” или “ускорил SSR при помощи синхронных useEffect”. Мне как-то попалось “оптимизировал приложение при помощи Redux”. Явные противоречия в  резюме возникают по двум основным причинам: 

▪️Кандидат крутил опыт самостоятельно и не разбирается в том, о чем говорит.
▪️Кандидату крутил опыт ментор и схалтурил, а кандидат и не понял. Если логических противоречий два или больше, это  серьезный редфлаг, потому что кандидат не понимает, что именно написано в его же резюме.

2️⃣ Повторяющиеся паттерны. Накрутчики копируют резюме друг у друга, а менторы халтурят и вставляют один и тот же текст в резюме разным кандидатам. Если вы смотрите много резюме, то вы скоро начнете видеть паттерны, которые повторяются из резюме в резюме. Повторяющиеся паттерны говорят о том, что конкретная задача из резюме с большой вероятностью не была сделана на самом деле.

3️⃣Внимательно запоминаем решенные задачи из резюме. Дальше пригодится. 

〰️ На собеседовании 〰️

🟢Теоретическая часть

Теоретическая часть в наше время прекрасно заучивается либо читается с экрана, поэтому ваша задача — обзорно пройтись по всем темам и запомнить, где кандидат дал неполные или неточные ответы. Потребуется в дальнейшем. Особенно важны темы, которые связаны с задачами в резюме. Иногда бывает, что на этом этапе кандидат начинает противоречить своему резюме, например, на вопрос о хранении данных в браузере назвал localStorage и sessionStorage, а в резюме фигурирует кеширование данных через IndexedDB. Это большой редфлаг, и я предпочитаю сразу спрашивать у кандидата, как же так вышло, что он забыл задачу, которую сам же и сделал.

🟢Практическая часть

На практической части важно не то, решил кандидат задачу или нет, важно то, как он ее решал. Смотрим на:

1️⃣Непротиворечивость хода рассуждений. Каждое следующее рассуждение в цепочке должно вытекать из предыдущего по законам формальной логики. 
2️⃣Если столкнулся с проблемами, то как решал их. 
3️⃣Какие паттерны в написании кода использует (рекурсию или итерацию предпочитает и тд).

🟢Ложные вопросы

Как я уже говорила, кандидат, скорее всего, будет вооружен ИИ, который знает все. Проблема в том, что ИИ знает даже то, чего не существует. Задайте кандидату пару бессмысленных вопросов, например, как избежать дедлока (во фронтенде) или race conditions в синхронном коде. Я так один раз спросила кандидата на должность фронтенд-разработчика, что такое доступность, и наслаждалась лекцией на тему трех девяток.

🟢Вопросы об опыте

Вопросы о предыдущем опыте лучше всего оставлять под конец, потому что тогда, во-первых, можно будет опираться на предыдущие ответы (мы их для этого запоминали), а во-вторых, кандидат устанет и ему будет сложнее лгать, если он собирался. Вопросы об опыте — самый сложный этап для накрутчиков и самый легкий для честных кандидатов. Один из маркеров: честные кандидаты хуже проходят техническую часть, чем вопросы об опыте, а накрутчики ровно наоборот. 

Берем пару-тройку интересных задач из резюме и спрашиваем детали реализации и выбор инструментов. Шок, но очень многие накрутчики  искренне удивляются, когда спрашиваешь у них про задачу из их же собственного резюме.У меня был кандидат, который ошарашенно спросил: «У меня там так написано?». Я говорю, что да. Он: «А можете прочитать?».  Ну, я добрая, я прочитала. «А, у вас неправильное резюме — искренне расстроился он, — я сейчас пришлю правильное!». И прислал же! Тоже накрученное. Короче говоря, проработка легенды в среднем по больнице просто отвратительная. 

Также обращаем внимание, когда кандидат говорил, что сделал что-то, с чем он плохо справился на теоретической/практической части. У меня был один, который утверждал, что написал собственную реализацию рекурсивного древовидного компонента на предыдущем месте, но dfs на практической части написать не смог даже приблизительно. В таких кейсах задаем простой незамысловатый вопрос — а как именно была реализована задача X? 

〰️ Итог 〰️

В 2026 году на рынке фронтенд-разработки крутят практически все, а честные кандидаты или приходят по рефералкам, или попадаются на уровне статпогрешности. Разница лишь в том, насколько резюме накрученное. Мои лайфхаки позволяют выявить ложь, а что с этим делать — решать вам. Накрученный опыт и жульничество на собеседовании не являются однозначным поводом к отказу в найме, но если вы нанимаете человека, который соврал об опыте и жульничал на собеседовании, то лучше делать это осознанно и понимая, на что вы идете, чтобы не быть разочарованным.

#собеседования #собеседуем