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