[{"data":1,"prerenderedAt":1532},["ShallowReactive",2],{"$f7MjXcGzwqR56Wy6sAB_xBT-DeY97LNcOTSZYro7xVlM":3,"$fMMUdSFktwQFqMVGPrTtt3EC5yheBp7PzwIqznamFcMo":120,"$f1Prj1xEczHja_-L7FyIGgRHd5_cSWHo7r6AE5aheAik":123,"$fc0LoAJgqXDLbKKd2JS_NpM4SuzBK8EycUXINSg09CKU":448,"$fM3ea55k6lKMPOTM84llDB26VSQDVVbxiQuSBFQw9P_c":451,"$fI5fDmvm-5tr9wcH0eHaKZa1j3y_FQIQaHHPqbZxAHJE":695,"mdc--5a1fhx-key":715,"mdc--jvz8y-key":746,"mdc--28a4aq-key":759,"mdc-9kdjwp-key":772,"mdc--adrz9i-key":785,"mdc--b405w-key":798,"mdc-fh841z-key":823,"mdc-7cprtt-key":853,"mdc--hnyj31-key":896,"mdc-988zhy-key":1050,"mdc-ntzm7s-key":1125,"mdc-mbzqn2-key":1169,"mdc-oxsjdd-key":1285,"mdc-ltww3o-key":1308,"mdc-n8bdtm-key":1321,"mdc-buocal-key":1349,"mdc--p8igmi-key":1406,"mdc-2xrdl5-key":1461,"mdc-qvntlr-key":1495},{"content":4,"quizQuestionContent":90,"type":109,"pageMeta":110},[5,9,13,16,20,23,27,30,34,37,41,44,48,52,55,59,63,66,70,73,77,80,84,87],{"id":6,"value":7,"isTypeH1":8},"1938","Что выведет console.log в результате выполнения цикла while?",true,{"id":10,"value":11,"anchor":12,"isTypeH2":8},"4477","Пошаговый разбор выполнения","step-by-step-execution",{"id":14,"value":15,"isTypeParagraph":8},"10299","Цикл `while` сначала вычисляет условие, и только затем выполняет тело цикла.\n\nВ условии используется `i--` (постфиксный декремент): в выражение подставляется старое значение, а уменьшение переменной происходит сразу после этого.\n\nИсходный код (для ориентира):\n```\nvar i = 10;\nvar array = [];\n\nwhile (i--) {\n    (function (i) {\n        var i = i;\n        array.push(function() {\n            return i + i;\n        });\n    })(i);\n}    \n\nconsole.log([\n    array[0](),\n    array[1](),\n])\n```",{"id":17,"value":18,"anchor":19,"isTypeH3":8},"4499","Итерация 1","iteration-1",{"id":21,"value":22,"isTypeParagraph":8},"10300","Старт: `i = 10`.\n\nУсловие `while (i--)` берёт значение `10` (истина), затем уменьшает `i` до `9`. В тело цикла попадает уже уменьшенное значение внешней `i`, то есть `i === 9`, и именно `9` передаётся в IIFE: `(function(i){...})(9)`.\n\nВнутри IIFE создаётся собственная область видимости функции, а параметр `i` — локальная переменная этой функции.\n\nСтрока `var i = i;` не создаёт «вторую» переменную: в пределах одной функции `var` не имеет блочной области видимости, а повторное объявление допустимо; фактически остаётся одна переменная `i` этой функции, которой просто присваивается текущее значение `i`.\n\nДалее в `array` кладётся функция, которая возвращает `i + i`, то есть `9 + 9 = 18`.",{"id":24,"value":25,"anchor":26,"isTypeH3":8},"4500","Итерация 2","iteration-2",{"id":28,"value":29,"isTypeParagraph":8},"10301","Перед проверкой условия: внешняя `i = 9`.\n\nУсловие `while (i--)` берёт значение `9` (истина), затем уменьшает `i` до `8`. В IIFE передаётся `8`, значит сохранённое (замкнутое) значение — `8`, и `array[1]()` вернёт `8 + 8 = 16`.",{"id":31,"value":32,"anchor":33,"isTypeH3":8},"4501","Почему значения не «уплывают»","why-values-dont-drift",{"id":35,"value":36,"isTypeParagraph":8},"10302","Ключевой момент: для каждого прохода цикла IIFE вызывается немедленно и получает аргумент (текущее число), а затем внутренняя функция замыкается на переменную `i` этой конкретной IIFE.\n\nТак как это разные вызовы функции, у них разные окружения (разные «ячейки памяти» для `i`), поэтому `array[0]` и `array[1]` возвращают разные стабильные значения.",{"id":38,"value":39,"anchor":40,"isTypeH2":8},"4478","Таблица значений по шагам","step-values-table",{"id":42,"value":43,"isTypeParagraph":8},"10303","| Номер шага | Значение, которое проверяет `while(i--)` | Внешняя `i` после декремента | Аргумент IIFE `(…)(i)` | Результат сохранённой функции |\n|---|---:|---:|---:|---:|\n| 1 | 10 | 9 | 9 | 18 |\n| 2 | 9 | 8 | 8 | 16 |",{"id":45,"description":46,"titleAlert":47,"isTypeAlertWarning":8},"736","Конструкция `var i = i;` выглядит как создание копии, но с `var` внутри одной и той же функции это не отдельная переменная, а повторное объявление той же переменной; такая запись ухудшает читаемость и часто становится источником ошибок при изучении областей видимости.",null,{"id":49,"value":50,"anchor":51,"isTypeH2":8},"4479","Мини-схема (что где живёт)","mini-diagram",{"id":53,"value":54,"isTypeParagraph":8},"10304","```\nГлобальная область:\n  i (внешняя)\n\nКаждая итерация while:\n  1) условие использует старое i, затем i уменьшается (i--)\n  2) вызывается IIFE с текущим (уже уменьшенным) i\n  3) IIFE создаёт свою локальную i\n  4) внутренняя функция замыкается на локальную i IIFE\n\narray[0] -> функция с i = 9  -> 9 + 9\narray[1] -> функция с i = 8  -> 8 + 8\n```",{"id":56,"value":57,"anchor":58,"isTypeH2":8},"4480","Теория по задаче","theory",{"id":60,"value":61,"anchor":62,"isTypeH3":8},"4502","while (condition) и порядок вычисления","while-condition-order",{"id":64,"value":65,"isTypeParagraph":8},"10305","У `while` условие вычисляется перед каждой итерацией, и только при истинности выполняется тело цикла.\n\nИз-за этого выражения с побочными эффектами (например, `i--`) прямо в условии влияют на то, какое значение окажется в теле цикла.",{"id":67,"value":68,"anchor":69,"isTypeH3":8},"4503","Постфиксный декремент x--","postfix-decrement",{"id":71,"value":72,"isTypeParagraph":8},"10306","Постфиксная форма `x--` возвращает значение до уменьшения, а уменьшение выполняется сразу после получения значения выражения.\n\nПоэтому в `while (i--)` проверяется «старое» `i`, но внутри тела цикла `i` уже меньше на 1.\n\nПример по аналогии:\n```\nlet x = 3;\nlet y = x--;\nconsole.log(x, y); // x станет 2, y будет 3\n```\n",{"id":74,"value":75,"anchor":76,"isTypeH3":8},"4504","var и область видимости функции","var-function-scope",{"id":78,"value":79,"isTypeParagraph":8},"10307","Переменные, объявленные через `var`, имеют область видимости функции (или глобальную, если функция отсутствует), а не область блока `{ ... }`.\n\nПоэтому запись `var i` внутри IIFE относится к одной и той же локальной переменной этой функции, даже если `var i` «повторяется» или стоит внутри вложенных блоков.\n\nТакже `var` допускает повторное объявление в той же области видимости без ошибки.",{"id":81,"value":82,"anchor":83,"isTypeH3":8},"4505","Замыкания и «запоминание» значения","closures",{"id":85,"value":86,"isTypeParagraph":8},"10308","Функция, помещённая в `array`, использует переменную `i`, находящуюся во внешней (для неё) функции IIFE, и тем самым образует замыкание.\n\nТак как IIFE вызывается заново на каждой итерации, создаётся новое окружение, и каждая добавленная функция «помнит» своё значение `i`.\n",{"id":88,"value":89,"isTypeParagraph":8},"10309","Кратко: краткая выжимка — правильный ответ `[18, 16]`, потому что `i--` в условии уменьшает внешнюю `i` до входа в тело цикла, а IIFE создаёт отдельное замыкание на значение `i` для каждой итерации.",{"id":91,"options":92,"hint":106,"solution":107,"description":108},"1167",[93,97,100,103],{"id":94,"label":95,"isCorrect":96},"4812","`[10, 9]`",false,{"id":98,"label":99,"isCorrect":8},"4813","`[18, 16]`",{"id":101,"label":102,"isCorrect":96},"4814","`[9, 8]`",{"id":104,"label":105,"isCorrect":96},"4815","`[16, 14]`","Для решения подобных задач удобно выписать два значения на каждой итерации: (1) что вернуло выражение в условии `while(i--)`, (2) чему равна `i` уже внутри тела цикла после декремента, и затем посмотреть, какое значение реально передаётся в IIFE.","**Правильный ответ: 2** -`console.log` выведет массив значений `[18, 16]`.","Дан код: \n\n```\nvar i = 10;\nvar array = [];\n\nwhile (i--) {\n    (function (i) {\n        var i = i;\n        array.push(function() {\n            return i + i;\n        });\n    })(i);\n}    \n\nconsole.log([\n    array[0](),\n    array[1](),\n])\n```\n\nЧто выведет console.log в результате выполнения кода?","quizQuestion",{"title":7,"description":111,"ogTitle":112,"ogDescription":111,"ogImageUrl":113,"canonical":47,"ogLocale":114,"ogSiteName":115,"ogImageType":116,"ogImageWidth":117,"ogImageHeight":118,"ogType":119,"ogUrl":47},"Определение вывода кода с while(i--), IIFE и var-областями видимости, с пошаговым разбором замыканий.","Разбор JS-кода: i--, IIFE и замыкания (console.log)","/og-image.png","ru_RU","goodwebjob.ru","image_jpeg","1200","630","article",{"siteName":121,"siteUrl":122},"GOOD WEB JOB!","https://goodwebjob.ru",{"slugs":124},[125,128,131,134,137,140,143,146,149,152,155,158,161,164,167,170,173,176,179,182,185,188,191,194,197,200,203,205,208,211,214,217,220,223,226,229,232,235,238,241,244,247,250,253,256,259,262,265,268,271,274,277,280,283,286,289,292,295,298,301,304,307,310,313,316,319,322,325,328,331,334,337,340,343,346,349,352,355,358,361,364,367,370,373,376,379,382,385,388,391,394,397,400,403,406,409,412,415,418,421,424,427,430,433,436,439,442,445],{"name":126,"value":127},"Теоретические задания","theoretical-tasks",{"name":129,"value":130},"Что вернёт этот код: typeof (function(){})()","what-this-code-will-return-typeof-function",{"name":132,"value":133},"С чего начать?","where-to-begin",{"name":135,"value":136},"Почему опасно писать прямо в прототипы базовых типов?","why-is-it-dangerous-to-write-directly-to-the-prototypes-of-basic-types",{"name":138,"value":139},"Backend","backend",{"name":141,"value":142},"Frontend","frontend",{"name":144,"value":145},"Какие логические значения в console.log будут получены?","prototype-what-logical-values-will-be-received-in-console-log",{"name":147,"value":148},"Нечётные числа должны отсортироваться по возрастанию, а чётные должны остаться на своих местах","odd-numbers-should-be-sorted-in-ascending-order-and-even-numbers-should-remain-in-their-original-positions",{"name":150,"value":151}," Найти в массиве неповторяющиеся числа","find-non-repeating-numbers-in-an-array",{"name":153,"value":154},"arr.push(0) повлияет на массив так же, как если бы мы выполнили...","arr-push-0-will-affect-the-array-in-the-same-way-as-if-we-performed",{"name":156,"value":157},"Дана строка: 'one.two.three.four.five'. Необходимо из строки сделать вложенный объект","the-string-one-two-three-four-five-is-given-it-is-necessary-to-make-a-nested-object-out-of-the-string",{"name":159,"value":160},"Реализовать функцию, похоже как в Jquery","implement-a-function-similar-to-jquery",{"name":162,"value":163},"Для каждого вложенного объекта нужно добавить свойство level, которое равняется числу - номер вложенности","for-each-nested-object-you-need-to-add-the-level-property-which-is-equal-to-a-number-the-nesting-number",{"name":165,"value":166},"Какое значение выведет консоль с object.property?","what-value-will-the-console-output-with-object-property",{"name":168,"value":169},"Что выведется в console.log([arr[0](), arr[0]()])?","what-will-be-displayed-in-console-log-arr-0-arr-0",{"name":171,"value":172},"Вернуть массив от 1 до n, где числа, кратные 3, заменены на 'fizz', кратные 5 - на 'buzz', а кратные и 3, и 5 одновременно - на 'fizzbuzz'","returns-an-array-from-1-to-n-replacing-numbers-that-are-multiples-of-3-with-fizz-numbers-that-are-multiples-of-5-with-buzz-and-numbers-that-are-multiples-of-both-3-and-5-with-fizzbuzz",{"name":174,"value":175},"Необходимо проверить, являются ли две строки анаграммами друг друга","checks-whether-two-strings-are-anagrams-of-each-other",{"name":177,"value":178},"Определить, является ли слово палиндромом","determines-whether-a-word-is-a-palindrome",{"name":180,"value":181},"Есть массив, в котором лежат объекты с датами, необходимо отсортировать даты по возрастанию","there-is-an-array-containing-objects-with-dates-that-need-to-be-sorted-by-date",{"name":183,"value":184},"Реализовать функцию, принимающую аргументы \"*\", \"1\", \"b\", \"1c\" и возвращающую строку \"1*b*1c\"","implement-a-function-that-accepts-arguments-1-b-1c-and-the-return-string-1-b-1c",{"name":186,"value":187},"Дано дерево (вложенный объект), надо найти сумму всех вершин","given-a-tree-nested-object-it-is-necessary-to-find-the-sum-of-all-vertices",{"name":189,"value":190},"Для каждой ветви дерева записать номер вложенности данной ветви","for-each-branch-of-the-tree-write-down-the-nesting-number-of-this-branch",{"name":192,"value":193},"Есть слова в массиве, необходимо определить, состоят ли они из одних и тех же букв","there-are-words-in-the-array-it-is-necessary-to-determine-whether-they-consist-of-the-same-letters",{"name":195,"value":196},"Числа от 1 до 100 находятся в массиве, они хаотично перемешанные, но в нём не хватает одного числа из этой последовательности. Необходимо найти его","the-numbers-from-1-to-100-are-in-the-array-they-are-randomly-mixed-but-it-lacks-one-number-from-this-sequence-it-is-necessary-to-find-him",{"name":198,"value":199},"Есть строка, состоящая из разных скобок, необходимо проверить, закрыты ли все","there-is-a-string-consisting-of-different-brackets-it-is-necessary-to-check-whether-all-are-closed",{"name":201,"value":202},"Напишите функцию, который сделает из массива объект","write-a-function-that-will-make-an-object-out-of-an-array",{"name":7,"value":204},"what-will-console-log-output-as-a-result-of-executing-the-while-loop",{"name":206,"value":207},"Есть функция и объект. Напишите все известные вам способы, чтобы вывести в консоли значение x из объекта, используя функцию","there-is-a-function-and-an-object-write-all-the-ways-you-know-to-output-the-value-of-x-from-an-object-in-the-console-using-the-function",{"name":209,"value":210},"Что выведет консоль в случае присвоения свойства массиву по строковому отрицательному индексу?","what-will-the-console-display-if-a-property-is-assigned-to-an-array-using-a-negative-string-index",{"name":212,"value":213},"Что выведет консоль в случае удаления элемента массива с помощью оператора delete?","what-will-the-console-output-if-an-array-element-is-deleted-using-the-delete-operator",{"name":215,"value":216},"Уникализация значений в массиве","unifying-values-in-an-array",{"name":218,"value":219},"«Расплющивание» массива","flattening-the-array",{"name":221,"value":222},"Что вернёт метод book.getUpperName()?","what-will-the-book-get-upper-name-method-return",{"name":224,"value":225},"Сжатие строк","string-compression",{"name":227,"value":228},"Что выведет консоль в случае присвоения свойства массиву по строковому положительному индексу?","what-will-the-console-display-if-a-property-is-assigned-to-an-array-using-a-positive-string-index",{"name":230,"value":231},"Что получится в результате передачи объекта как аргумента в функцию и выполнения кода?","what-will-happen-when-an-object-is-passed-as-an-argument-to-a-function-and-the-code-is-executed",{"name":233,"value":234},"Как браузер после ввода домена понимает, откуда брать сайт?","how-does-the-browser-know-where-to-get-the-website-after-entering-the-domain",{"name":236,"value":237},"Как домен попадает в DNS в таблицу соответствия: домен – ip","how-does-a-domain-get-into-the-dns-mapping-table-domain-ip",{"name":239,"value":240},"Как браузер решает, какое соединение ему открывать, TCP или UDP?","how-does-a-browser-decide-whether-to-open-a-tcp-or-udp-connection",{"name":242,"value":243},"Ключевые отличия TCP и UDP","key-differences-between-tcp-and-udp",{"name":245,"value":246},"\"TCP/IP\" - кем является TCP, а кем IP в данном случае?","tcp-ip-who-is-tcp-and-who-is-ip-in-this-case",{"name":248,"value":249},"Что такое HTTP и из чего состоит?","what-is-http-and-what-does-it-consist-of",{"name":251,"value":252},"Что такое заголовки в HTTP и зачем они нужны?","what-are-http-headers-and-why-do-we-need-them",{"name":254,"value":255},"Что такое параметры в HTTP?","what-are-http-parameters",{"name":257,"value":258},"Где находится HTML-код в структуре HTTP-ответа?","where-is-the-html-code-located-in-the-http-response-structure",{"name":260,"value":261},"Что такое HTML?","what-is-html",{"name":263,"value":264},"Чем отличаются 1.0, 1.1, 2.0, 3.0 версии HTTP?","what-are-the-differences-between-http-versions-1-0-1-1-2-0-and-3-0",{"name":266,"value":267},"Пользователь авторизован на сайте. Как сервер узнает об этом с последующими другими заходами, что «я – авторизованный пользователь»?","the-user-is-logged-in-on-the-website-how-does-the-server-know-that-i-am-an-authorized-user-when-the-user-logs-in-again",{"name":269,"value":270},"Что такое cookie?","what-is-a-cookie",{"name":272,"value":273},"Кто является инициатором записи cookie в браузере?","who-initiates-the-cookie-recording-in-the-browser",{"name":275,"value":276},"Есть ли возможность с клиента (с браузера) управлять cookie?","is-it-possible-to-manage-cookies-from-the-client-browser",{"name":278,"value":279},"Лайвкодинг","livecoding",{"name":281,"value":282},"Что вернёт следующий код? Object.create(null).hasOwnProperty('toString')","what-will-the-following-code-return-object-create-null-has-own-property-to-string",{"name":284,"value":285},"Всё, что идет по HTTPS – оно защищено?","is-everything-that-goes-through-https-secure",{"name":287,"value":288},"Все данные зашифрованы, используется https. Хакер взламывает dns и делает подмену одного ip на другой, на фишинговый сайт. В этом случае, злоумышленник может получить данные (логин \\ пароль)?","all-data-is-encrypted-https-is-used-let-s-assume-a-hacker-hacks-the-dns-and-makes-a-substitution-of-one-ip-for-another-a-phishing-site",{"name":290,"value":291},"Есть веб-приложение. Помимо HTTP, какие протоколы того же уровня (Application Layer) можно дополнительно использовать в веб-приложении в браузере?","there-is-a-web-application-in-addition-to-http-what-other-protocols-of-the-same-level-application-layer-can-be-used-in-the-web-application-in-browser",{"name":293,"value":294},"Как браузер парсит JavaScript и изображения при рендеринге?","how-the-browser-parses-javascript-and-images-when-rendering",{"name":296,"value":297},"Что происходит, когда HTTP прислал HTML? Что браузер дальше делает c HTML с учетом того, что она валидная?","what-happens-when-http-sends-html-what-does-the-browser-do-with-this-html-given-that-it-is-valid",{"name":299,"value":300},"Что в браузере блокирует рендеринг страницы?","what-is-blocking-the-page-rendering-in-the-browser",{"name":302,"value":303},"Что такое DOM в браузере? Что такое CSSOM?","what-is-dom-in-a-browser-what-is-cssom",{"name":305,"value":306},"Что является узлами в DOM?","what-are-nodes-in-the-dom",{"name":308,"value":309},"Из чего состоит CSSOM?","what-does-cssom-consist-of",{"name":311,"value":312},"Дан HTML-код. Какой будет цвет у текста «Some dummy text»?","the-html-code-is-given-what-will-be-the-color-of-the-some-dummy-text",{"name":314,"value":315},"Есть шаблон HTML и CSS кода. Какой будет цвет у текста «Таким образом, постоянное»?","there-is-a-template-for-html-and-css-code-what-color-will-the-text-thus-constant-have",{"name":317,"value":318},"Есть шаблон вложенного HTML кода. Какой будет цвет у текста «One more dummy text»?","there-is-a-template-for-embedded-html-code-what-will-be-the-color-of-the-one-more-dummy-text",{"name":320,"value":321},"Есть шаблон вложенного HTML кода. Будет ли display:block у body влиять на span?","there-is-a-template-for-embedded-html-code-will-there-be-a-display-does-bodys-block-affect-span",{"name":323,"value":324},"Есть HTML код. Будет ли font-weight на span влиять?","there-is-an-html-code-will-font-weight-affect-span",{"name":326,"value":327},"Flexbox и Grid, чем отличаются друг от друга?","what-are-the-differences-between-flexbox-and-grid",{"name":329,"value":330},"Заменяют ли Flexbox и Grid друг друга?","do-flexbox-and-grid-replace-each-other",{"name":332,"value":333},"Есть CSS и JS анимация. Какая между ними разница, что быстрее, что более удобно?","there-are-css-and-js-animations-what-is-the-difference-between-them-and-which-is-faster-and-more-convenient",{"name":335,"value":336},"Сборник задач","tasks",{"name":338,"value":339},"Какие способы объявления функции есть в JavaScript?","what-are-the-ways-to-declare-a-function-in-javascript",{"name":341,"value":342},"Что такое this в JavaScript?","what-is-this-in-javascript",{"name":344,"value":345},"Что такое Event Loop, как работает?","what-is-an-event-loop-and-how-does-it-work",{"name":347,"value":348},"Что будет, если вызвать typeof на необъявленной переменной?","what-happens-if-you-call-typeof-on-an-undeclared-variable",{"name":350,"value":351},"Что показывает оператор typeof в JavaScript?","what-does-the-typeof-operator-show-in-javascript",{"name":353,"value":354},"Какие типы данных существует в JavaScript?","what-types-of-data-exist-in-javascript",{"name":356,"value":357},"Какую структуру использовать для хранения упорядоченного списка строк в JavaScript?","what-is-the-best-structure-to-use-for-storing-an-ordered-list-of-strings-in-javascript",{"name":359,"value":360},"Что вернет typeof для массива?","what-will-typeof-return-for-an-array",{"name":362,"value":363},"Почему оператор typeof, применённый к массиву, возвращает объект?","why-does-the-typeof-operator-applied-to-an-array-return-an-object",{"name":365,"value":366},"Если нужно хранить список уникальных строк, какую структуру данных выбрать?","if-you-need-to-store-a-list-of-unique-strings-which-data-structure-should-i-choose",{"name":368,"value":369},"Что возвращает typeof для new Set в JavaScript?","what-does-typeof-return-for-new-set-in-javascript",{"name":371,"value":372},"Для чего нужен React, какие он решает проблемы?","what-is-react-used-for-and-what-problems-does-it-solve",{"name":374,"value":375},"Если убрать в React VDOM/Fiber, и вручную изменять DOM, разве это не оптимально?","if-you-remove-the-vdom-fiber-in-react-and-manually-change-the-dom-isn-t-that-optimal",{"name":377,"value":378},"Есть блок кода. Что в реальном DOM изменится после нажатия на кнопку?","there-is-a-block-of-code-what-changes-in-the-real-dom-after-clicking-the-button",{"name":380,"value":381},"Есть код, в котором список и кнопка. Что в реальном DOM изменится после нажатия на кнопку?","there-is-a-code-in-which-there-is-a-list-and-a-button-what-will-change-in-the-real-dom-after-clicking-on-the-button",{"name":383,"value":384},"Зачем нужен Redux (Mobx/Effector)? Зачем нужен менеджер состояния? Какие проблемы решает?","why-do-we-need-redux-mobx-effector-why-do-we-need-a-state-manager-what-problems-does-it-solve",{"name":386,"value":387},"Как диагностировать и исправить нежелательное изменение цвета фона по клику на кнопку, если исходный код сайта запутан и недоступен для прямого чтения?","how-can-diagnose-and-fix-unwanted-background-color-changes-when-clicking-on-a-button-if-the-source-code-of-the-site-is-confusing-and-inaccessible-to-direct-reading",{"name":389,"value":390},"Разрабатывал, взял закоммитил, запушил. Оказалось, что запушил не в ту ветку, точнее, коммит не в ту ветку. Какие действия?","developed-it-committed-it-and-launched-it-it-turned-out-that-i-had-pushed-it-to-the-wrong-branch-or-rather-the-commit-was-in-the-wrong-branch-what-actions",{"name":392,"value":393},"В git есть несколько вариантов слияния веток, какие? Чем отличаются?","git-has-several-options-for-merging-branches-which-ones-how-are-they-different",{"name":395,"value":396},"Какие существуют стратегии ветвления для работы команды? Что это такое?","what-are-the-branching-strategies-for-the-team-what-is-it",{"name":398,"value":399},"По каким характеристикам, ревьюер понимает, что данный код - хороший, а этот код - плохой?","how-does-a-reviewer-know-which-code-is-good-and-which-code-is-bad",{"name":401,"value":402},"Дан фрагмент bash-скрипта: cd ~; mkdir foo... Что в нем происходит?","here-is-a-fragment-of-a-bash-script-cd-mkdir-foo-what-is-happening-in-this-script",{"name":404,"value":405},"Дан фрагмент bash-скрипта: target=$(ps -Af | grep $1 | head -n 1)...","here-is-a-fragment-of-a-bash-script-target-ps-af-grep-1-head-n-1",{"name":407,"value":408},"Что такое алгоритмическая сложность?","what-is-algorithmic-complexity",{"name":410,"value":411},"Какая алгоритмическая сложность у \"быстрой сортировки\"?","what-is-the-algorithmic-complexity-of-quick-sort",{"name":413,"value":414},"Почему в JavaScript два объекта с одинаковым содержимым при сравнении возвращают false?","why-do-two-objects-with-the-same-content-return-false-when-compared-in-javascript",{"name":416,"value":417},"Каким способом может выполняться авторизация пользователя на сайте?","how-can-a-user-be-authorized-on-a-website",{"name":419,"value":420},"В чем разница между микро- и макро-тасками в JavaScript?","what-is-the-difference-between-micro-and-macro-tasks-in-javascript",{"name":422,"value":423},"В комнате три человека. Какова вероятность того, что хотя бы двое из них одного пола? То есть два и более.","there-are-three-people-in-the-room-what-is-the-probability-that-at-least-two-of-them-are-of-the-same-sex-that-is-two-or-more",{"name":425,"value":426},"Есть монета. Ее подбрасывают пять раз подряд. Каждый раз записывается, что выпало - орел или решка. Сколько разных последовательностей орлов и решек может при этом получиться?","there-is-a-coin-it-is-tossed-five-times-in-a-row-each-time-it-is-recorded-whether-it-lands-on-heads-or-tails-how-many-different-sequences-of-heads-and-tails-can-be-obtained",{"name":428,"value":429},"Как гарантированно найти лёгкую фальшивую монету среди 8 за минимальное число взвешиваний на чашечных весах?","how-can-you-guarantee-to-find-an-easy-fake-coin-among-8-in-the-minimum-number-of-weighings-on-a-balance-scale",{"name":431,"value":432},"Подготовка к тех.интервью","technical-interview",{"name":434,"value":435},"Верно ли утверждение, что злоумышленник, контролирующий роутер и прослушивающий трафик, может получить логины и пароли от сайтов, на которые заходит клиент?","is-it-true-that-an-attacker-who-controls-a-router-and-listens-to-traffic-can-obtain-logins-and-passwords-from-websites-that-a-client-visits",{"name":437,"value":438},"Что такое DNS, как DNS находит нужный IP-адрес?","what-is-dns-and-how-does-dns-find-the-correct-ip-address",{"name":440,"value":441},"Переменные объявлены следующим образом: a=3; b=«hello»;. Укажите правильное утверждение","variables-are-declared-as-follows-specify-the-correct-statement",{"name":443,"value":444},"Какой механизм лежит в основе оптимизации обновлений DOM в React?","what-is-the-underlying-mechanism-for-optimizing-dom-updates-in-react",{"name":446,"value":447},"Что мешает организовать централизованное состояние без менеджера состояния? Если организовать состояние механизмами реакта: контекстом, стейтом, в чем проблема? Что менеджеры состояния привносят?","what-prevents-you-from-organizing-a-centralized-state-without-a-state-manager-if-you-organize-the-state-using-react-context-and-state-mechanisms-what-is-the-problem-what-do-state-managers-add",[449],{"label":431,"slug":432,"to":450},"/technical-interview/where-to-begin",{"navigationList":452,"navigationSublist":458},[453,455],{"path":450,"isActive":96,"name":132,"icon":454,"isNavbarMobileDisabled":8},"material-symbols:visibility-outline-rounded",{"path":456,"isActive":8,"name":335,"icon":457,"isNavbarMobileDisabled":96},"/technical-interview/tasks","material-symbols:task-outline",[459,466,485,494,499,594,611,618,623,666,681,686],{"title":460,"list":461,"isOpened":96},"Bash",[462,464],{"name":401,"path":463,"isActive":96},"/technical-interview/tasks/here-is-a-fragment-of-a-bash-script-cd-mkdir-foo-what-is-happening-in-this-script",{"name":404,"path":465,"isActive":96},"/technical-interview/tasks/here-is-a-fragment-of-a-bash-script-target-ps-af-grep-1-head-n-1",{"title":467,"list":468,"isOpened":96},"CSS",[469,471,473,475,477,479,481,483],{"name":311,"path":470,"isActive":96},"/technical-interview/tasks/the-html-code-is-given-what-will-be-the-color-of-the-some-dummy-text",{"name":314,"path":472,"isActive":96},"/technical-interview/tasks/there-is-a-template-for-html-and-css-code-what-color-will-the-text-thus-constant-have",{"name":317,"path":474,"isActive":96},"/technical-interview/tasks/there-is-a-template-for-embedded-html-code-what-will-be-the-color-of-the-one-more-dummy-text",{"name":320,"path":476,"isActive":96},"/technical-interview/tasks/there-is-a-template-for-embedded-html-code-will-there-be-a-display-does-bodys-block-affect-span",{"name":323,"path":478,"isActive":96},"/technical-interview/tasks/there-is-an-html-code-will-font-weight-affect-span",{"name":326,"path":480,"isActive":96},"/technical-interview/tasks/what-are-the-differences-between-flexbox-and-grid",{"name":329,"path":482,"isActive":96},"/technical-interview/tasks/do-flexbox-and-grid-replace-each-other",{"name":332,"path":484,"isActive":96},"/technical-interview/tasks/there-are-css-and-js-animations-what-is-the-difference-between-them-and-which-is-faster-and-more-convenient",{"title":486,"list":487,"isOpened":96},"Git",[488,490,492],{"name":389,"path":489,"isActive":96},"/technical-interview/tasks/developed-it-committed-it-and-launched-it-it-turned-out-that-i-had-pushed-it-to-the-wrong-branch-or-rather-the-commit-was-in-the-wrong-branch-what-actions",{"name":392,"path":491,"isActive":96},"/technical-interview/tasks/git-has-several-options-for-merging-branches-which-ones-how-are-they-different",{"name":395,"path":493,"isActive":96},"/technical-interview/tasks/what-are-the-branching-strategies-for-the-team-what-is-it",{"title":495,"list":496,"isOpened":96},"HTML",[497],{"name":260,"path":498,"isActive":96},"/technical-interview/tasks/what-is-html",{"title":500,"list":501,"isOpened":96},"JavaScript",[502,504,506,508,510,512,514,516,518,520,522,524,526,528,530,532,534,536,538,540,542,544,546,548,550,552,554,556,558,560,562,564,566,568,570,572,574,576,578,580,582,584,586,588,590,592],{"name":144,"path":503,"isActive":96},"/technical-interview/tasks/prototype-what-logical-values-will-be-received-in-console-log",{"name":135,"path":505,"isActive":96},"/technical-interview/tasks/why-is-it-dangerous-to-write-directly-to-the-prototypes-of-basic-types",{"name":281,"path":507,"isActive":96},"/technical-interview/tasks/what-will-the-following-code-return-object-create-null-has-own-property-to-string",{"name":165,"path":509,"isActive":96},"/technical-interview/tasks/what-value-will-the-console-output-with-object-property",{"name":168,"path":511,"isActive":96},"/technical-interview/tasks/what-will-be-displayed-in-console-log-arr-0-arr-0",{"name":7,"path":513,"isActive":96},"/technical-interview/tasks/what-will-console-log-output-as-a-result-of-executing-the-while-loop",{"name":206,"path":515,"isActive":96},"/technical-interview/tasks/there-is-a-function-and-an-object-write-all-the-ways-you-know-to-output-the-value-of-x-from-an-object-in-the-console-using-the-function",{"name":221,"path":517,"isActive":96},"/technical-interview/tasks/what-will-the-book-get-upper-name-method-return",{"name":440,"path":519,"isActive":96},"/technical-interview/tasks/variables-are-declared-as-follows-specify-the-correct-statement",{"name":227,"path":521,"isActive":96},"/technical-interview/tasks/what-will-the-console-display-if-a-property-is-assigned-to-an-array-using-a-positive-string-index",{"name":209,"path":523,"isActive":96},"/technical-interview/tasks/what-will-the-console-display-if-a-property-is-assigned-to-an-array-using-a-negative-string-index",{"name":212,"path":525,"isActive":96},"/technical-interview/tasks/what-will-the-console-output-if-an-array-element-is-deleted-using-the-delete-operator",{"name":129,"path":527,"isActive":96},"/technical-interview/tasks/what-this-code-will-return-typeof-function",{"name":230,"path":529,"isActive":96},"/technical-interview/tasks/what-will-happen-when-an-object-is-passed-as-an-argument-to-a-function-and-the-code-is-executed",{"name":338,"path":531,"isActive":96},"/technical-interview/tasks/what-are-the-ways-to-declare-a-function-in-javascript",{"name":341,"path":533,"isActive":96},"/technical-interview/tasks/what-is-this-in-javascript",{"name":344,"path":535,"isActive":96},"/technical-interview/tasks/what-is-an-event-loop-and-how-does-it-work",{"name":347,"path":537,"isActive":96},"/technical-interview/tasks/what-happens-if-you-call-typeof-on-an-undeclared-variable",{"name":350,"path":539,"isActive":96},"/technical-interview/tasks/what-does-the-typeof-operator-show-in-javascript",{"name":353,"path":541,"isActive":96},"/technical-interview/tasks/what-types-of-data-exist-in-javascript",{"name":356,"path":543,"isActive":96},"/technical-interview/tasks/what-is-the-best-structure-to-use-for-storing-an-ordered-list-of-strings-in-javascript",{"name":359,"path":545,"isActive":96},"/technical-interview/tasks/what-will-typeof-return-for-an-array",{"name":362,"path":547,"isActive":96},"/technical-interview/tasks/why-does-the-typeof-operator-applied-to-an-array-return-an-object",{"name":365,"path":549,"isActive":96},"/technical-interview/tasks/if-you-need-to-store-a-list-of-unique-strings-which-data-structure-should-i-choose",{"name":368,"path":551,"isActive":96},"/technical-interview/tasks/what-does-typeof-return-for-new-set-in-javascript",{"name":413,"path":553,"isActive":96},"/technical-interview/tasks/why-do-two-objects-with-the-same-content-return-false-when-compared-in-javascript",{"name":419,"path":555,"isActive":96},"/technical-interview/tasks/what-is-the-difference-between-micro-and-macro-tasks-in-javascript",{"name":153,"path":557,"isActive":96},"/technical-interview/tasks/arr-push-0-will-affect-the-array-in-the-same-way-as-if-we-performed",{"name":171,"path":559,"isActive":96},"/technical-interview/tasks/returns-an-array-from-1-to-n-replacing-numbers-that-are-multiples-of-3-with-fizz-numbers-that-are-multiples-of-5-with-buzz-and-numbers-that-are-multiples-of-both-3-and-5-with-fizzbuzz",{"name":156,"path":561,"isActive":96},"/technical-interview/tasks/the-string-one-two-three-four-five-is-given-it-is-necessary-to-make-a-nested-object-out-of-the-string",{"name":186,"path":563,"isActive":96},"/technical-interview/tasks/given-a-tree-nested-object-it-is-necessary-to-find-the-sum-of-all-vertices",{"name":162,"path":565,"isActive":96},"/technical-interview/tasks/for-each-nested-object-you-need-to-add-the-level-property-which-is-equal-to-a-number-the-nesting-number",{"name":189,"path":567,"isActive":96},"/technical-interview/tasks/for-each-branch-of-the-tree-write-down-the-nesting-number-of-this-branch",{"name":180,"path":569,"isActive":96},"/technical-interview/tasks/there-is-an-array-containing-objects-with-dates-that-need-to-be-sorted-by-date",{"name":192,"path":571,"isActive":96},"/technical-interview/tasks/there-are-words-in-the-array-it-is-necessary-to-determine-whether-they-consist-of-the-same-letters",{"name":198,"path":573,"isActive":96},"/technical-interview/tasks/there-is-a-string-consisting-of-different-brackets-it-is-necessary-to-check-whether-all-are-closed",{"name":150,"path":575,"isActive":96},"/technical-interview/tasks/find-non-repeating-numbers-in-an-array",{"name":201,"path":577,"isActive":96},"/technical-interview/tasks/write-a-function-that-will-make-an-object-out-of-an-array",{"name":174,"path":579,"isActive":96},"/technical-interview/tasks/checks-whether-two-strings-are-anagrams-of-each-other",{"name":147,"path":581,"isActive":96},"/technical-interview/tasks/odd-numbers-should-be-sorted-in-ascending-order-and-even-numbers-should-remain-in-their-original-positions",{"name":177,"path":583,"isActive":96},"/technical-interview/tasks/determines-whether-a-word-is-a-palindrome",{"name":218,"path":585,"isActive":96},"/technical-interview/tasks/flattening-the-array",{"name":183,"path":587,"isActive":96},"/technical-interview/tasks/implement-a-function-that-accepts-arguments-1-b-1c-and-the-return-string-1-b-1c",{"name":224,"path":589,"isActive":96},"/technical-interview/tasks/string-compression",{"name":215,"path":591,"isActive":96},"/technical-interview/tasks/unifying-values-in-an-array",{"name":195,"path":593,"isActive":96},"/technical-interview/tasks/the-numbers-from-1-to-100-are-in-the-array-they-are-randomly-mixed-but-it-lacks-one-number-from-this-sequence-it-is-necessary-to-find-him",{"title":595,"list":596,"isOpened":96},"React",[597,599,601,603,605,607,609],{"name":371,"path":598,"isActive":96},"/technical-interview/tasks/what-is-react-used-for-and-what-problems-does-it-solve",{"name":443,"path":600,"isActive":96},"/technical-interview/tasks/what-is-the-underlying-mechanism-for-optimizing-dom-updates-in-react",{"name":374,"path":602,"isActive":96},"/technical-interview/tasks/if-you-remove-the-vdom-fiber-in-react-and-manually-change-the-dom-isn-t-that-optimal",{"name":377,"path":604,"isActive":96},"/technical-interview/tasks/there-is-a-block-of-code-what-changes-in-the-real-dom-after-clicking-the-button",{"name":380,"path":606,"isActive":96},"/technical-interview/tasks/there-is-a-code-in-which-there-is-a-list-and-a-button-what-will-change-in-the-real-dom-after-clicking-on-the-button",{"name":383,"path":608,"isActive":96},"/technical-interview/tasks/why-do-we-need-redux-mobx-effector-why-do-we-need-a-state-manager-what-problems-does-it-solve",{"name":446,"path":610,"isActive":96},"/technical-interview/tasks/what-prevents-you-from-organizing-a-centralized-state-without-a-state-manager-if-you-organize-the-state-using-react-context-and-state-mechanisms-what-is-the-problem-what-do-state-managers-add",{"title":612,"list":613,"isOpened":96},"Алгоритмы",[614,616],{"name":407,"path":615,"isActive":96},"/technical-interview/tasks/what-is-algorithmic-complexity",{"name":410,"path":617,"isActive":96},"/technical-interview/tasks/what-is-the-algorithmic-complexity-of-quick-sort",{"title":619,"list":620,"isOpened":96},"Дебаггинг",[621],{"name":386,"path":622,"isActive":96},"/technical-interview/tasks/how-can-diagnose-and-fix-unwanted-background-color-changes-when-clicking-on-a-button-if-the-source-code-of-the-site-is-confusing-and-inaccessible-to-direct-reading",{"title":624,"list":625,"isOpened":96},"Компьютерные сети",[626,628,630,632,634,636,638,640,642,644,646,648,650,652,654,656,658,660,662,664],{"name":233,"path":627,"isActive":96},"/technical-interview/tasks/how-does-the-browser-know-where-to-get-the-website-after-entering-the-domain",{"name":437,"path":629,"isActive":96},"/technical-interview/tasks/what-is-dns-and-how-does-dns-find-the-correct-ip-address",{"name":236,"path":631,"isActive":96},"/technical-interview/tasks/how-does-a-domain-get-into-the-dns-mapping-table-domain-ip",{"name":239,"path":633,"isActive":96},"/technical-interview/tasks/how-does-a-browser-decide-whether-to-open-a-tcp-or-udp-connection",{"name":242,"path":635,"isActive":96},"/technical-interview/tasks/key-differences-between-tcp-and-udp",{"name":245,"path":637,"isActive":96},"/technical-interview/tasks/tcp-ip-who-is-tcp-and-who-is-ip-in-this-case",{"name":248,"path":639,"isActive":96},"/technical-interview/tasks/what-is-http-and-what-does-it-consist-of",{"name":251,"path":641,"isActive":96},"/technical-interview/tasks/what-are-http-headers-and-why-do-we-need-them",{"name":254,"path":643,"isActive":96},"/technical-interview/tasks/what-are-http-parameters",{"name":257,"path":645,"isActive":96},"/technical-interview/tasks/where-is-the-html-code-located-in-the-http-response-structure",{"name":263,"path":647,"isActive":96},"/technical-interview/tasks/what-are-the-differences-between-http-versions-1-0-1-1-2-0-and-3-0",{"name":266,"path":649,"isActive":96},"/technical-interview/tasks/the-user-is-logged-in-on-the-website-how-does-the-server-know-that-i-am-an-authorized-user-when-the-user-logs-in-again",{"name":269,"path":651,"isActive":96},"/technical-interview/tasks/what-is-a-cookie",{"name":272,"path":653,"isActive":96},"/technical-interview/tasks/who-initiates-the-cookie-recording-in-the-browser",{"name":275,"path":655,"isActive":96},"/technical-interview/tasks/is-it-possible-to-manage-cookies-from-the-client-browser",{"name":434,"path":657,"isActive":96},"/technical-interview/tasks/is-it-true-that-an-attacker-who-controls-a-router-and-listens-to-traffic-can-obtain-logins-and-passwords-from-websites-that-a-client-visits",{"name":284,"path":659,"isActive":96},"/technical-interview/tasks/is-everything-that-goes-through-https-secure",{"name":287,"path":661,"isActive":96},"/technical-interview/tasks/all-data-is-encrypted-https-is-used-let-s-assume-a-hacker-hacks-the-dns-and-makes-a-substitution-of-one-ip-for-another-a-phishing-site",{"name":290,"path":663,"isActive":96},"/technical-interview/tasks/there-is-a-web-application-in-addition-to-http-what-other-protocols-of-the-same-level-application-layer-can-be-used-in-the-web-application-in-browser",{"name":416,"path":665,"isActive":96},"/technical-interview/tasks/how-can-a-user-be-authorized-on-a-website",{"title":667,"list":668,"isOpened":96},"Отрисовка в браузере",[669,671,673,675,677,679],{"name":296,"path":670,"isActive":96},"/technical-interview/tasks/what-happens-when-http-sends-html-what-does-the-browser-do-with-this-html-given-that-it-is-valid",{"name":293,"path":672,"isActive":96},"/technical-interview/tasks/how-the-browser-parses-javascript-and-images-when-rendering",{"name":299,"path":674,"isActive":96},"/technical-interview/tasks/what-is-blocking-the-page-rendering-in-the-browser",{"name":302,"path":676,"isActive":96},"/technical-interview/tasks/what-is-dom-in-a-browser-what-is-cssom",{"name":305,"path":678,"isActive":96},"/technical-interview/tasks/what-are-nodes-in-the-dom",{"name":308,"path":680,"isActive":96},"/technical-interview/tasks/what-does-cssom-consist-of",{"title":682,"list":683,"isOpened":96},"Ревью кода",[684],{"name":398,"path":685,"isActive":96},"/technical-interview/tasks/how-does-a-reviewer-know-which-code-is-good-and-which-code-is-bad",{"title":687,"list":688,"isOpened":96},"Теория вероятности",[689,691,693],{"name":422,"path":690,"isActive":96},"/technical-interview/tasks/there-are-three-people-in-the-room-what-is-the-probability-that-at-least-two-of-them-are-of-the-same-sex-that-is-two-or-more",{"name":425,"path":692,"isActive":96},"/technical-interview/tasks/there-is-a-coin-it-is-tossed-five-times-in-a-row-each-time-it-is-recorded-whether-it-lands-on-heads-or-tails-how-many-different-sequences-of-heads-and-tails-can-be-obtained",{"name":428,"path":694,"isActive":96},"/technical-interview/tasks/how-can-you-guarantee-to-find-an-easy-fake-coin-among-8-in-the-minimum-number-of-weighings-on-a-balance-scale",{"cooperation":696,"copyright":699,"reportError":700,"socialNetwork":702},{"link":697,"title":698},"https://t.me/baurinanton","Сотрудничество","© “GOOD WEB JOB!”",{"label":701,"link":697},"Сообщить об ошибке",{"label":703,"socialNetworkList":704},"Мы в соцсетях:",[705,708,711],{"icon":47,"link":706,"title":707},"https://max.ru/u/f9LHodD0cOKMaukdnnahTeL5pwvjrPfUaZ4S8_1rsNy9I9qsmc9Ar3kP_y8","Max",{"icon":709,"link":697,"title":710},"ic:baseline-telegram","Telegram",{"icon":712,"link":713,"title":714},"ri:vk-fill","https://vk.com/baurinanton","VK",{"data":716,"body":717},{},{"type":718,"children":719},"root",[720,728,741],{"type":721,"tag":722,"props":723,"children":724},"element","p",{},[725],{"type":726,"value":727},"text","Дан код:",{"type":721,"tag":729,"props":730,"children":734},"pre",{"className":731,"code":733,"language":726},[732],"language-text","var i = 10;\nvar array = [];\n\nwhile (i--) {\n    (function (i) {\n        var i = i;\n        array.push(function() {\n            return i + i;\n        });\n    })(i);\n}    \n\nconsole.log([\n    array[0](),\n    array[1](),\n])\n",[735],{"type":721,"tag":736,"props":737,"children":739},"code",{"__ignoreMap":738},"",[740],{"type":726,"value":733},{"type":721,"tag":722,"props":742,"children":743},{},[744],{"type":726,"value":745},"Что выведет console.log в результате выполнения кода?",{"data":747,"body":748},{},{"type":718,"children":749},[750],{"type":721,"tag":722,"props":751,"children":752},{},[753],{"type":721,"tag":736,"props":754,"children":756},{"className":755},[],[757],{"type":726,"value":758},"[10, 9]",{"data":760,"body":761},{},{"type":718,"children":762},[763],{"type":721,"tag":722,"props":764,"children":765},{},[766],{"type":721,"tag":736,"props":767,"children":769},{"className":768},[],[770],{"type":726,"value":771},"[18, 16]",{"data":773,"body":774},{},{"type":718,"children":775},[776],{"type":721,"tag":722,"props":777,"children":778},{},[779],{"type":721,"tag":736,"props":780,"children":782},{"className":781},[],[783],{"type":726,"value":784},"[9, 8]",{"data":786,"body":787},{},{"type":718,"children":788},[789],{"type":721,"tag":722,"props":790,"children":791},{},[792],{"type":721,"tag":736,"props":793,"children":795},{"className":794},[],[796],{"type":726,"value":797},"[16, 14]",{"data":799,"body":800},{},{"type":718,"children":801},[802],{"type":721,"tag":722,"props":803,"children":804},{},[805,807,813,815,821],{"type":726,"value":806},"Для решения подобных задач удобно выписать два значения на каждой итерации: (1) что вернуло выражение в условии ",{"type":721,"tag":736,"props":808,"children":810},{"className":809},[],[811],{"type":726,"value":812},"while(i--)",{"type":726,"value":814},", (2) чему равна ",{"type":721,"tag":736,"props":816,"children":818},{"className":817},[],[819],{"type":726,"value":820},"i",{"type":726,"value":822}," уже внутри тела цикла после декремента, и затем посмотреть, какое значение реально передаётся в IIFE.",{"data":824,"body":825},{},{"type":718,"children":826},[827],{"type":721,"tag":722,"props":828,"children":829},{},[830,836,838,844,846,851],{"type":721,"tag":831,"props":832,"children":833},"strong",{},[834],{"type":726,"value":835},"Правильный ответ: 2",{"type":726,"value":837}," -",{"type":721,"tag":736,"props":839,"children":841},{"className":840},[],[842],{"type":726,"value":843},"console.log",{"type":726,"value":845}," выведет массив значений ",{"type":721,"tag":736,"props":847,"children":849},{"className":848},[],[850],{"type":726,"value":771},{"type":726,"value":852},".",{"data":854,"body":855},{},{"type":718,"children":856},[857,870,883,888],{"type":721,"tag":722,"props":858,"children":859},{},[860,862,868],{"type":726,"value":861},"Цикл ",{"type":721,"tag":736,"props":863,"children":865},{"className":864},[],[866],{"type":726,"value":867},"while",{"type":726,"value":869}," сначала вычисляет условие, и только затем выполняет тело цикла.",{"type":721,"tag":722,"props":871,"children":872},{},[873,875,881],{"type":726,"value":874},"В условии используется ",{"type":721,"tag":736,"props":876,"children":878},{"className":877},[],[879],{"type":726,"value":880},"i--",{"type":726,"value":882}," (постфиксный декремент): в выражение подставляется старое значение, а уменьшение переменной происходит сразу после этого.",{"type":721,"tag":722,"props":884,"children":885},{},[886],{"type":726,"value":887},"Исходный код (для ориентира):",{"type":721,"tag":729,"props":889,"children":891},{"className":890,"code":733,"language":726},[732],[892],{"type":721,"tag":736,"props":893,"children":894},{"__ignoreMap":738},[895],{"type":726,"value":733},{"data":897,"body":898},{},{"type":718,"children":899},[900,912,977,989,1023],{"type":721,"tag":722,"props":901,"children":902},{},[903,905,911],{"type":726,"value":904},"Старт: ",{"type":721,"tag":736,"props":906,"children":908},{"className":907},[],[909],{"type":726,"value":910},"i = 10",{"type":726,"value":852},{"type":721,"tag":722,"props":913,"children":914},{},[915,917,923,925,931,933,938,940,946,948,953,955,961,963,968,970,976],{"type":726,"value":916},"Условие ",{"type":721,"tag":736,"props":918,"children":920},{"className":919},[],[921],{"type":726,"value":922},"while (i--)",{"type":726,"value":924}," берёт значение ",{"type":721,"tag":736,"props":926,"children":928},{"className":927},[],[929],{"type":726,"value":930},"10",{"type":726,"value":932}," (истина), затем уменьшает ",{"type":721,"tag":736,"props":934,"children":936},{"className":935},[],[937],{"type":726,"value":820},{"type":726,"value":939}," до ",{"type":721,"tag":736,"props":941,"children":943},{"className":942},[],[944],{"type":726,"value":945},"9",{"type":726,"value":947},". В тело цикла попадает уже уменьшенное значение внешней ",{"type":721,"tag":736,"props":949,"children":951},{"className":950},[],[952],{"type":726,"value":820},{"type":726,"value":954},", то есть ",{"type":721,"tag":736,"props":956,"children":958},{"className":957},[],[959],{"type":726,"value":960},"i === 9",{"type":726,"value":962},", и именно ",{"type":721,"tag":736,"props":964,"children":966},{"className":965},[],[967],{"type":726,"value":945},{"type":726,"value":969}," передаётся в IIFE: ",{"type":721,"tag":736,"props":971,"children":973},{"className":972},[],[974],{"type":726,"value":975},"(function(i){...})(9)",{"type":726,"value":852},{"type":721,"tag":722,"props":978,"children":979},{},[980,982,987],{"type":726,"value":981},"Внутри IIFE создаётся собственная область видимости функции, а параметр ",{"type":721,"tag":736,"props":983,"children":985},{"className":984},[],[986],{"type":726,"value":820},{"type":726,"value":988}," — локальная переменная этой функции.",{"type":721,"tag":722,"props":990,"children":991},{},[992,994,1000,1002,1008,1010,1015,1017,1022],{"type":726,"value":993},"Строка ",{"type":721,"tag":736,"props":995,"children":997},{"className":996},[],[998],{"type":726,"value":999},"var i = i;",{"type":726,"value":1001}," не создаёт «вторую» переменную: в пределах одной функции ",{"type":721,"tag":736,"props":1003,"children":1005},{"className":1004},[],[1006],{"type":726,"value":1007},"var",{"type":726,"value":1009}," не имеет блочной области видимости, а повторное объявление допустимо; фактически остаётся одна переменная ",{"type":721,"tag":736,"props":1011,"children":1013},{"className":1012},[],[1014],{"type":726,"value":820},{"type":726,"value":1016}," этой функции, которой просто присваивается текущее значение ",{"type":721,"tag":736,"props":1018,"children":1020},{"className":1019},[],[1021],{"type":726,"value":820},{"type":726,"value":852},{"type":721,"tag":722,"props":1024,"children":1025},{},[1026,1028,1034,1036,1042,1043,1049],{"type":726,"value":1027},"Далее в ",{"type":721,"tag":736,"props":1029,"children":1031},{"className":1030},[],[1032],{"type":726,"value":1033},"array",{"type":726,"value":1035}," кладётся функция, которая возвращает ",{"type":721,"tag":736,"props":1037,"children":1039},{"className":1038},[],[1040],{"type":726,"value":1041},"i + i",{"type":726,"value":954},{"type":721,"tag":736,"props":1044,"children":1046},{"className":1045},[],[1047],{"type":726,"value":1048},"9 + 9 = 18",{"type":726,"value":852},{"data":1051,"body":1052},{},{"type":718,"children":1053},[1054,1066],{"type":721,"tag":722,"props":1055,"children":1056},{},[1057,1059,1065],{"type":726,"value":1058},"Перед проверкой условия: внешняя ",{"type":721,"tag":736,"props":1060,"children":1062},{"className":1061},[],[1063],{"type":726,"value":1064},"i = 9",{"type":726,"value":852},{"type":721,"tag":722,"props":1067,"children":1068},{},[1069,1070,1075,1076,1081,1082,1087,1088,1094,1096,1101,1103,1108,1110,1116,1118,1124],{"type":726,"value":916},{"type":721,"tag":736,"props":1071,"children":1073},{"className":1072},[],[1074],{"type":726,"value":922},{"type":726,"value":924},{"type":721,"tag":736,"props":1077,"children":1079},{"className":1078},[],[1080],{"type":726,"value":945},{"type":726,"value":932},{"type":721,"tag":736,"props":1083,"children":1085},{"className":1084},[],[1086],{"type":726,"value":820},{"type":726,"value":939},{"type":721,"tag":736,"props":1089,"children":1091},{"className":1090},[],[1092],{"type":726,"value":1093},"8",{"type":726,"value":1095},". В IIFE передаётся ",{"type":721,"tag":736,"props":1097,"children":1099},{"className":1098},[],[1100],{"type":726,"value":1093},{"type":726,"value":1102},", значит сохранённое (замкнутое) значение — ",{"type":721,"tag":736,"props":1104,"children":1106},{"className":1105},[],[1107],{"type":726,"value":1093},{"type":726,"value":1109},", и ",{"type":721,"tag":736,"props":1111,"children":1113},{"className":1112},[],[1114],{"type":726,"value":1115},"array[1]()",{"type":726,"value":1117}," вернёт ",{"type":721,"tag":736,"props":1119,"children":1121},{"className":1120},[],[1122],{"type":726,"value":1123},"8 + 8 = 16",{"type":726,"value":852},{"data":1126,"body":1127},{},{"type":718,"children":1128},[1129,1141],{"type":721,"tag":722,"props":1130,"children":1131},{},[1132,1134,1139],{"type":726,"value":1133},"Ключевой момент: для каждого прохода цикла IIFE вызывается немедленно и получает аргумент (текущее число), а затем внутренняя функция замыкается на переменную ",{"type":721,"tag":736,"props":1135,"children":1137},{"className":1136},[],[1138],{"type":726,"value":820},{"type":726,"value":1140}," этой конкретной IIFE.",{"type":721,"tag":722,"props":1142,"children":1143},{},[1144,1146,1151,1153,1159,1161,1167],{"type":726,"value":1145},"Так как это разные вызовы функции, у них разные окружения (разные «ячейки памяти» для ",{"type":721,"tag":736,"props":1147,"children":1149},{"className":1148},[],[1150],{"type":726,"value":820},{"type":726,"value":1152},"), поэтому ",{"type":721,"tag":736,"props":1154,"children":1156},{"className":1155},[],[1157],{"type":726,"value":1158},"array[0]",{"type":726,"value":1160}," и ",{"type":721,"tag":736,"props":1162,"children":1164},{"className":1163},[],[1165],{"type":726,"value":1166},"array[1]",{"type":726,"value":1168}," возвращают разные стабильные значения.",{"data":1170,"body":1171},{},{"type":718,"children":1172},[1173],{"type":721,"tag":1174,"props":1175,"children":1176},"table",{},[1177,1230],{"type":721,"tag":1178,"props":1179,"children":1180},"thead",{},[1181],{"type":721,"tag":1182,"props":1183,"children":1184},"tr",{},[1185,1191,1202,1214,1225],{"type":721,"tag":1186,"props":1187,"children":1188},"th",{},[1189],{"type":726,"value":1190},"Номер шага",{"type":721,"tag":1186,"props":1192,"children":1194},{"align":1193},"right",[1195,1197],{"type":726,"value":1196},"Значение, которое проверяет ",{"type":721,"tag":736,"props":1198,"children":1200},{"className":1199},[],[1201],{"type":726,"value":812},{"type":721,"tag":1186,"props":1203,"children":1204},{"align":1193},[1205,1207,1212],{"type":726,"value":1206},"Внешняя ",{"type":721,"tag":736,"props":1208,"children":1210},{"className":1209},[],[1211],{"type":726,"value":820},{"type":726,"value":1213}," после декремента",{"type":721,"tag":1186,"props":1215,"children":1216},{"align":1193},[1217,1219],{"type":726,"value":1218},"Аргумент IIFE ",{"type":721,"tag":736,"props":1220,"children":1222},{"className":1221},[],[1223],{"type":726,"value":1224},"(…)(i)",{"type":721,"tag":1186,"props":1226,"children":1227},{"align":1193},[1228],{"type":726,"value":1229},"Результат сохранённой функции",{"type":721,"tag":1231,"props":1232,"children":1233},"tbody",{},[1234,1260],{"type":721,"tag":1182,"props":1235,"children":1236},{},[1237,1243,1247,1251,1255],{"type":721,"tag":1238,"props":1239,"children":1240},"td",{},[1241],{"type":726,"value":1242},"1",{"type":721,"tag":1238,"props":1244,"children":1245},{"align":1193},[1246],{"type":726,"value":930},{"type":721,"tag":1238,"props":1248,"children":1249},{"align":1193},[1250],{"type":726,"value":945},{"type":721,"tag":1238,"props":1252,"children":1253},{"align":1193},[1254],{"type":726,"value":945},{"type":721,"tag":1238,"props":1256,"children":1257},{"align":1193},[1258],{"type":726,"value":1259},"18",{"type":721,"tag":1182,"props":1261,"children":1262},{},[1263,1268,1272,1276,1280],{"type":721,"tag":1238,"props":1264,"children":1265},{},[1266],{"type":726,"value":1267},"2",{"type":721,"tag":1238,"props":1269,"children":1270},{"align":1193},[1271],{"type":726,"value":945},{"type":721,"tag":1238,"props":1273,"children":1274},{"align":1193},[1275],{"type":726,"value":1093},{"type":721,"tag":1238,"props":1277,"children":1278},{"align":1193},[1279],{"type":726,"value":1093},{"type":721,"tag":1238,"props":1281,"children":1282},{"align":1193},[1283],{"type":726,"value":1284},"16",{"data":1286,"body":1287},{},{"type":718,"children":1288},[1289],{"type":721,"tag":722,"props":1290,"children":1291},{},[1292,1294,1299,1301,1306],{"type":726,"value":1293},"Конструкция ",{"type":721,"tag":736,"props":1295,"children":1297},{"className":1296},[],[1298],{"type":726,"value":999},{"type":726,"value":1300}," выглядит как создание копии, но с ",{"type":721,"tag":736,"props":1302,"children":1304},{"className":1303},[],[1305],{"type":726,"value":1007},{"type":726,"value":1307}," внутри одной и той же функции это не отдельная переменная, а повторное объявление той же переменной; такая запись ухудшает читаемость и часто становится источником ошибок при изучении областей видимости.",{"data":1309,"body":1310},{},{"type":718,"children":1311},[1312],{"type":721,"tag":729,"props":1313,"children":1316},{"className":1314,"code":1315,"language":726},[732],"Глобальная область:\n  i (внешняя)\n\nКаждая итерация while:\n  1) условие использует старое i, затем i уменьшается (i--)\n  2) вызывается IIFE с текущим (уже уменьшенным) i\n  3) IIFE создаёт свою локальную i\n  4) внутренняя функция замыкается на локальную i IIFE\n\narray[0] -> функция с i = 9  -> 9 + 9\narray[1] -> функция с i = 8  -> 8 + 8\n",[1317],{"type":721,"tag":736,"props":1318,"children":1319},{"__ignoreMap":738},[1320],{"type":726,"value":1315},{"data":1322,"body":1323},{},{"type":718,"children":1324},[1325,1337],{"type":721,"tag":722,"props":1326,"children":1327},{},[1328,1330,1335],{"type":726,"value":1329},"У ",{"type":721,"tag":736,"props":1331,"children":1333},{"className":1332},[],[1334],{"type":726,"value":867},{"type":726,"value":1336}," условие вычисляется перед каждой итерацией, и только при истинности выполняется тело цикла.",{"type":721,"tag":722,"props":1338,"children":1339},{},[1340,1342,1347],{"type":726,"value":1341},"Из-за этого выражения с побочными эффектами (например, ",{"type":721,"tag":736,"props":1343,"children":1345},{"className":1344},[],[1346],{"type":726,"value":880},{"type":726,"value":1348},") прямо в условии влияют на то, какое значение окажется в теле цикла.",{"data":1350,"body":1351},{},{"type":718,"children":1352},[1353,1366,1392,1397],{"type":721,"tag":722,"props":1354,"children":1355},{},[1356,1358,1364],{"type":726,"value":1357},"Постфиксная форма ",{"type":721,"tag":736,"props":1359,"children":1361},{"className":1360},[],[1362],{"type":726,"value":1363},"x--",{"type":726,"value":1365}," возвращает значение до уменьшения, а уменьшение выполняется сразу после получения значения выражения.",{"type":721,"tag":722,"props":1367,"children":1368},{},[1369,1371,1376,1378,1383,1385,1390],{"type":726,"value":1370},"Поэтому в ",{"type":721,"tag":736,"props":1372,"children":1374},{"className":1373},[],[1375],{"type":726,"value":922},{"type":726,"value":1377}," проверяется «старое» ",{"type":721,"tag":736,"props":1379,"children":1381},{"className":1380},[],[1382],{"type":726,"value":820},{"type":726,"value":1384},", но внутри тела цикла ",{"type":721,"tag":736,"props":1386,"children":1388},{"className":1387},[],[1389],{"type":726,"value":820},{"type":726,"value":1391}," уже меньше на 1.",{"type":721,"tag":722,"props":1393,"children":1394},{},[1395],{"type":726,"value":1396},"Пример по аналогии:",{"type":721,"tag":729,"props":1398,"children":1401},{"className":1399,"code":1400,"language":726},[732],"let x = 3;\nlet y = x--;\nconsole.log(x, y); // x станет 2, y будет 3\n",[1402],{"type":721,"tag":736,"props":1403,"children":1404},{"__ignoreMap":738},[1405],{"type":726,"value":1400},{"data":1407,"body":1408},{},{"type":718,"children":1409},[1410,1429,1449],{"type":721,"tag":722,"props":1411,"children":1412},{},[1413,1415,1420,1422,1428],{"type":726,"value":1414},"Переменные, объявленные через ",{"type":721,"tag":736,"props":1416,"children":1418},{"className":1417},[],[1419],{"type":726,"value":1007},{"type":726,"value":1421},", имеют область видимости функции (или глобальную, если функция отсутствует), а не область блока ",{"type":721,"tag":736,"props":1423,"children":1425},{"className":1424},[],[1426],{"type":726,"value":1427},"{ ... }",{"type":726,"value":852},{"type":721,"tag":722,"props":1430,"children":1431},{},[1432,1434,1440,1442,1447],{"type":726,"value":1433},"Поэтому запись ",{"type":721,"tag":736,"props":1435,"children":1437},{"className":1436},[],[1438],{"type":726,"value":1439},"var i",{"type":726,"value":1441}," внутри IIFE относится к одной и той же локальной переменной этой функции, даже если ",{"type":721,"tag":736,"props":1443,"children":1445},{"className":1444},[],[1446],{"type":726,"value":1439},{"type":726,"value":1448}," «повторяется» или стоит внутри вложенных блоков.",{"type":721,"tag":722,"props":1450,"children":1451},{},[1452,1454,1459],{"type":726,"value":1453},"Также ",{"type":721,"tag":736,"props":1455,"children":1457},{"className":1456},[],[1458],{"type":726,"value":1007},{"type":726,"value":1460}," допускает повторное объявление в той же области видимости без ошибки.",{"data":1462,"body":1463},{},{"type":718,"children":1464},[1465,1484],{"type":721,"tag":722,"props":1466,"children":1467},{},[1468,1470,1475,1477,1482],{"type":726,"value":1469},"Функция, помещённая в ",{"type":721,"tag":736,"props":1471,"children":1473},{"className":1472},[],[1474],{"type":726,"value":1033},{"type":726,"value":1476},", использует переменную ",{"type":721,"tag":736,"props":1478,"children":1480},{"className":1479},[],[1481],{"type":726,"value":820},{"type":726,"value":1483},", находящуюся во внешней (для неё) функции IIFE, и тем самым образует замыкание.",{"type":721,"tag":722,"props":1485,"children":1486},{},[1487,1489,1494],{"type":726,"value":1488},"Так как IIFE вызывается заново на каждой итерации, создаётся новое окружение, и каждая добавленная функция «помнит» своё значение ",{"type":721,"tag":736,"props":1490,"children":1492},{"className":1491},[],[1493],{"type":726,"value":820},{"type":726,"value":852},{"data":1496,"body":1497},{},{"type":718,"children":1498},[1499],{"type":721,"tag":722,"props":1500,"children":1501},{},[1502,1504,1509,1511,1516,1518,1523,1525,1530],{"type":726,"value":1503},"Кратко: краткая выжимка — правильный ответ ",{"type":721,"tag":736,"props":1505,"children":1507},{"className":1506},[],[1508],{"type":726,"value":771},{"type":726,"value":1510},", потому что ",{"type":721,"tag":736,"props":1512,"children":1514},{"className":1513},[],[1515],{"type":726,"value":880},{"type":726,"value":1517}," в условии уменьшает внешнюю ",{"type":721,"tag":736,"props":1519,"children":1521},{"className":1520},[],[1522],{"type":726,"value":820},{"type":726,"value":1524}," до входа в тело цикла, а IIFE создаёт отдельное замыкание на значение ",{"type":721,"tag":736,"props":1526,"children":1528},{"className":1527},[],[1529],{"type":726,"value":820},{"type":726,"value":1531}," для каждой итерации.",1775735655417]