prefer-global-this.md

prefer-global-this

📝 Prefer globalThis over window, self, and global.

💼 This rule is enabled in the following configs: ✅ recommended, ☑️ unopinionated.

🔧 This rule is automatically fixable by the --fix CLI option.

This rule will enforce the use of globalThis over window, self, and global.

However, there are several exceptions that remain permitted:

1. Certain window-specific APIs, such as window.innerHeight
2. Window-specific events, such as window.addEventListener('resize')
3. Computed property access on window, such as window[foo]
4. typeof existence checks, such as typeof window === 'undefined'

The complete list of permitted APIs can be found in the rule's source code.

Examples

// ❌
window;

// ✅
globalThis;

// ❌
window.foo;

// ✅
globalThis.foo;

// ❌
global;

// ✅
globalThis;

// ❌
global.foo;

// ✅
globalThis.foo;

// ❌
const {foo} = window;

// ✅
const {foo} = globalThis;

// ❌
window.navigator;

// ✅
globalThis.navigator;

// ❌
window.location;

// ✅
globalThis.location;

// ✅
window.innerWidth;

// ✅
window.innerHeight;

// ✅
typeof window === 'undefined';

// ✅
typeof window === 'object';

// ❌
window.addEventListener('click', () => {});

// ✅
globalThis.addEventListener('click', () => {});

// ✅
window.addEventListener('resize', () => {});

// ✅
window.addEventListener('load', () => {});

// ✅
window.addEventListener('unload', () => {});