// Разница между Context, Scope, Scope-chain и Лексическим окружением в JavaScript // 📌 1️⃣ Context (Контекст) // Это значение this — окружение, которое определяет, откуда вызывается функция. console.log('Глобальный контекст:', this); // В браузере — window, в Node.js — global const user = { name: 'Alice', greet() { console.log('Контекст объекта (this):', this.name); } }; user.greet(); // 'Alice' // 📌 2️⃣ Scope (Область видимости) // Это область, где видны переменные и функции. function exampleScope() { let a = 'локальная'; // a доступна только внутри этой функции console.log(a); } exampleScope(); // 'локальная' // console.log(a); // Ошибка: a is not defined // 📌 3️⃣ Scope-chain (Цепочка областей видимости) // Это механизм поиска переменной вверх по цепочке областей видимости. // Формируется на основе лексического окружения. const globalVar = 'глобальная'; function outer() { const outerVar = 'внешняя'; function inner() { console.log(globalVar); // Ищет в глобальном скоупе console.log(outerVar); // Ищет во внешнем скоупе } inner(); } outer(); // 'глобальная', 'внешняя' // 📌 4️⃣ Lexical Environment (Лексическое окружение) // Лексическое окружение — основа для формирования цепочки областей видимости. // Каждый блок создаёт своё лексическое окружение с переменными и ссылками на внешние окружения. function outerFunc() { let outerVar = 'внешняя переменная'; function innerFunc() { console.log(outerVar); // Получает доступ через лексическое окружение } innerFunc(); } outerFunc(); // 'внешняя переменная' // 📝 Связь между Scope-chain и Lexical Environment: // Scope-chain — это результат объединения лексических окружений. // Лексическое окружение создаёт структуру видимости, которую Scope-chain использует для поиска переменных. // 💡 ИТОГ: // - Context — значение this (кто вызывает функцию). // - Scope — область видимости переменных. // - Scope-chain — цепочка поиска переменных, образованная из лексических окружений. // - Lexical Environment — механизм создания областей видимости и основа для Scope-chain. // 📌 📌 📌 Определение ключевого слова this в JavaScript и примеры📌 📌 📌 // 📌 Определение: // 'this' — это ключевое слово, которое указывает на контекст выполнения функции. // Контекст зависит от способа вызова функции. // 📌 1️⃣ Глобальный контекст // В глобальном контексте this ссылается на глобальный объект (window в браузере, global в Node.js). console.log('Глобальный контекст:', this); // 📌 2️⃣ this внутри метода объекта const user = { name: 'Alice', greet() { console.log('this в методе объекта:', this.name); } }; user.greet(); // 'Alice' // 📌 3️⃣ this в обычной функции // В зависимости от режима ('strict' или нет), this может быть undefined или глобальным объектом. function showName() { console.log('this в обычной функции:', this); } showName(); // В браузере: window, в strict: undefined // 📌 4️⃣ this в стрелочной функции // Стрелочная функция не создаёт свой контекст, а использует внешний. const arrowFunc = () => { console.log('this в стрелочной функции:', this); }; arrowFunc(); // Наследует контекст из внешнего окружения // 📌 5️⃣ this в обработчике события const button = document.createElement('button'); button.innerText = 'Нажми меня'; button.addEventListener('click', function () { console.log('this в обработчике события:', this); }); document.body.appendChild(button); // 📌 6️⃣ Явное указание контекста: call, apply, bind function sayHi() { console.log('Явный контекст:', this.name); } const person = { name: 'Bob' }; sayHi.call(person); // 'Bob' // 💡 Итог: // - 'this' — это контекст выполнения функции. // - В стрелочных функциях 'this' берётся из внешнего контекста. // -