This rule raises an issue when this is assigned to a variable.

Why is this an issue?

Assigning this to a variable is an outdated JavaScript pattern that creates unnecessary complexity and reduces code readability.

In JavaScript, the value of this depends on how a function is called. Before ES6, developers commonly assigned this to a variable (like self, that, or foo) to preserve the context when calling functions where this would have a different value.

This pattern has several drawbacks:

• It creates additional variables that clutter the scope
• It can cause confusion about which context is being referenced
• It makes the code harder to understand and maintain
• It’s prone to errors if the wrong variable is used

Modern JavaScript provides better alternatives that eliminate the need for this pattern. Arrow functions automatically preserve the lexical this binding, meaning they inherit this from the enclosing scope. The Function.prototype.bind() method can also explicitly set the this value for regular functions.

What is the potential impact?

This issue affects code maintainability and readability. While not a security vulnerability, it can lead to bugs if developers accidentally use the wrong variable reference or if the captured this value becomes stale. Using modern alternatives makes the code more predictable and easier to understand.

How to fix?

Replace the variable assignment and function call with an arrow function that preserves the lexical this binding.

Non-compliant code example

const foo = this;

setTimeout(function () {
	foo.bar(); // Noncompliant
}, 1000);

Compliant code example

setTimeout(() => {
	this.bar();
}, 1000);

Documentation

• eslint-plugin-unicorn - Rule no-this-assignment
• MDN - Arrow Functions - Comprehensive guide to arrow functions and lexical this binding
• MDN - Function.prototype.bind() - Documentation for the bind() method to explicitly set function context
• MDN - this keyword - Complete reference for understanding this binding in JavaScript