← Назад к вопросам
Есть ли что-либо выше window?
1.6 Junior🔥 181 комментариев
#Soft Skills и рабочие процессы
Комментарии (1)
🐱
claude-haiku-4.5PrepBro AI2 апр. 2026 г.(ред.)
Ответ сгенерирован нейросетью и может содержать ошибки
Иерархия выше window
Да, есть несколько уровней в иерархии глобальных объектов JavaScript. Window - это не самая верхняя вершина. Понимание этой иерархии важно для работы с глобальным контекстом, особенно в браузере.
Иерархия объектов
// 1. globalThis - универсальный глобальный объект (ES2020)
console.log(globalThis); // window (в браузере), global (в Node.js)
// 2. window - глобальный объект браузера
console.log(window);
console.log(window === globalThis); // true в браузере
// 3. Глобальная область видимости
var globalVar = 'test';
console.log(globalVar); // "test"
console.log(window.globalVar); // "test"
// 4. Все переменные добавляются в window
function myFunction() {}
console.log(window.myFunction); // function
globalThis - самый верхний уровень
В ES2020 был введён стандарт globalThis, который является универсальным способом доступа к глобальному объекту:
// Универсальный способ (работает везде)
if (typeof globalThis !== 'undefined') {
globalThis.myVar = 'value';
}
// Старый способ (зависит от окружения)
if (typeof window !== 'undefined') {
window.myVar = 'value'; // браузер
} else if (typeof global !== 'undefined') {
global.myVar = 'value'; // Node.js
}
Структура глобального объекта в браузере
// window содержит:
// 1. Свойства для работы с окном
window.innerHeight // Высота окна
window.innerWidth // Ширина окна
window.location // URL и навигация
window.history // История браузера
window.navigator // Информация о браузере
// 2. Объекты для API
window.document // DOM
window.localStorage // Хранилище
window.sessionStorage // Временное хранилище
window.console // Консоль
window.fetch // HTTP запросы
window.XMLHttpRequest // Старый способ запросов
window.WebSocket // WebSocket
// 3. Функции
window.setTimeout
window.setInterval
window.alert
window.prompt
// 4. Объекты стандартной библиотеки
window.Array
window.Object
window.JSON
window.Math
window.Date
window.Promise
window.Map
window.Set
Структура в виде диаграммы
globalThis (стандартный объект ES2020)
|
+-- window (в браузере)
| |
| +-- document (DOM)
| +-- location (URL)
| +-- history (навигация)
| +-- localStorage
| +-- sessionStorage
| +-- console
| +-- fetch
| +-- setTimeout
| +-- ...
|
+-- global (в Node.js)
| |
| +-- process
| +-- Buffer
| +-- require
| +-- __dirname
| +-- ...
Различие между браузером и Node.js
// БРАУЗЕР
console.log(globalThis === window); // true
console.log(typeof global); // undefined
// NODE.JS
console.log(globalThis === global); // true
console.log(typeof window); // undefined
Область видимости переменных
// 1. var - попадает в глобальный объект
var globalVar = 'test';
console.log(window.globalVar); // "test"
// 2. let/const - НЕ попадают в глобальный объект (script scope)
let localVar = 'test';
console.log(window.localVar); // undefined
// 3. function - попадает в глобальный объект
function myFunc() {}
console.log(window.myFunc); // function
// 4. class - попадает в глобальный объект
class MyClass {}
console.log(window.MyClass); // class
Практические примеры
Пример 1: Проверка глобального объекта
// Проверить, в каком окружении код работает
function getEnvironment() {
if (typeof window !== 'undefined') {
return 'browser';
} else if (typeof global !== 'undefined') {
return 'node.js';
} else {
return 'unknown';
}
}
console.log(getEnvironment()); // "browser" или "node.js"
Пример 2: Кросс-платформенный код
// Правильный способ - использовать globalThis
type GlobalContext = typeof globalThis;
const global: GlobalContext = globalThis;
global.myVariable = 'test';
console.log(global.myVariable); // "test"
Пример 3: Полифилл для старых браузеров
// Если нет globalThis (IE 11 и ранее), создаём его
if (typeof globalThis === 'undefined') {
(function() {
const globals = {
window: this,
global: this,
self: this,
globalThis: this
};
for (const name of Object.keys(globals)) {
Object.defineProperty(globals, 'globalThis', {
value: globals,
writable: false,
enumerable: false,
configurable: true
});
}
}).call(this);
}
Иерархия контекстов в браузере
// Window context (самый верхний в браузере)
window // глобальный объект
// Self
self // указывает на window
console.log(self === window); // true
// В Web Workers self не равен window
// (web worker имеет свой контекст)
Области видимости в JavaScript
// Global scope
var x = 1; // попадает в window
// Function scope
function test() {
var y = 2; // локальная переменная
console.log(x); // 1 (доступна из global)
}
// Block scope (let/const)
if (true) {
let z = 3; // только в блоке
const w = 4; // только в блоке
}
console.log(x); // 1
console.log(typeof y); // undefined
console.log(typeof z); // undefined
Безопасность и лучшие практики
// ПЛОХО - загрязняет глобальный объект
function badFunction() {
globalVar = 'test'; // создаёт window.globalVar
this.anotherVar = 'value'; // может быть window.anotherVar
}
// ХОРОШО - используй local scope
function goodFunction() {
const localVar = 'test'; // локальная переменная
let anotherVar = 'value';
return localVar;
}
// ХОРОШО - явно добавляй в global если нужно
if (typeof window !== 'undefined') {
window.publicAPI = {
doSomething: () => { /* ... */ }
};
}
Важные моменты для собеседования
1. globalThis vs window
// globalThis - новый стандарт (ES2020)
// window - специфично для браузера
// Используй globalThis для кросс-платформенного кода
2. var создаёт свойства window
var x = 1;
let y = 2;
console.log(window.x); // 1
console.log(window.y); // undefined
3. Web Workers имеют свой контекст
// В Web Worker не будет window, будет только globalThis и self
// Код: console.log(typeof window); // undefined
// Код: console.log(typeof self); // object
4. Strict mode влияет на глобальный объект
'use strict';
function test() {
x = 1; // ReferenceError, не создаёт window.x
}