class-methods-use-this

Enforce that class methods utilize this

If a class method does not use this, it can sometimes be made into a static function. If you do convert the method into a static function, instances of the class that call that particular method have to be converted to a static call as well (MyClass.callStaticMethod())

It’s possible to have a class method which doesn’t use this, such as:

class A {
    constructor() {
        this.a = "hi";
    }

    print() {
        console.log(this.a);
    }

    sayHi() {
        console.log("hi");
    }
}

let a = new A();
a.sayHi(); // => "hi"
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

In the example above, the sayHi method doesn’t use this, so we can make it a static method:

class A {
    constructor() {
        this.a = "hi";
    }

    print() {
        console.log(this.a);
    }

    static sayHi() {
        console.log("hi");
    }
}

A.sayHi(); // => "hi"
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

Also note in the above examples that if you switch a method to a static method, instances of the class that call the static method (let a = new A(); a.sayHi();) have to be updated to being a static call (A.sayHi();) instead of having the instance of the class call the method.

Rule Details

This rule is aimed to flag class methods that do not use this.

Examples of incorrect code for this rule:

/*eslint class-methods-use-this: "error"*/

class A {
    foo() {
        console.log("Hello World");     /*error Expected 'this' to be used by class method 'foo'.*/
    }
}
1
2
3
4
5
6
7

Examples of correct code for this rule:

/*eslint class-methods-use-this: "error"*/

class A {
    foo() {
        this.bar = "Hello World"; // OK, this is used
    }
}

class B {
    constructor() {
        // OK. constructor is exempt
    }
}

class C {
    static foo() {
        // OK. static methods aren't expected to use this.
    }

    static {
        // OK. static blocks are exempt.
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

Options

This rule has four options:

• "exceptMethods" allows specified method names to be ignored with this rule.
• "enforceForClassFields" enforces that functions used as instance field initializers utilize this. (default: true)
• "ignoreOverrideMethods" ignores members that are marked with the override modifier. (TypeScript only, default: false)
• "ignoreClassesWithImplements" ignores class members that are defined within a class that implements an interface. (TypeScript only)

exceptMethods

"class-methods-use-this": [<enabled>, { "exceptMethods": [<...exceptions>] }]
1

The "exceptMethods" option allows you to pass an array of method names for which you would like to ignore warnings. For example, you might have a spec from an external library that requires you to overwrite a method as a regular function (and not as a static method) and does not use this inside the function body. In this case, you can add that method to ignore in the warnings.

Examples of incorrect code for this rule when used without "exceptMethods":

/*eslint class-methods-use-this: "error"*/

class A {
    foo() {
    }
}
1
2
3
4
5
6

Examples of correct code for this rule when used with exceptMethods:

/*eslint class-methods-use-this: ["error", { "exceptMethods": ["foo", "#bar"] }] */

class A {
    foo() {
    }
    #bar() {
    }
}
1
2
3
4
5
6
7
8

enforceForClassFields

"class-methods-use-this": [<enabled>, { "enforceForClassFields": true | false }]
1

The enforceForClassFields option enforces that arrow functions and function expressions used as instance field initializers utilize this. (default: true)

Examples of incorrect code for this rule with the { "enforceForClassFields": true } option (default):

/*eslint class-methods-use-this: ["error", { "enforceForClassFields": true }] */

class A {
    foo = () => {}
}
1
2
3
4
5

Examples of correct code for this rule with the { "enforceForClassFields": true } option (default):

/*eslint class-methods-use-this: ["error", { "enforceForClassFields": true }] */

class A {
    foo = () => {this;}
}
1
2
3
4
5

Examples of correct code for this rule with the { "enforceForClassFields": false } option:

/*eslint class-methods-use-this: ["error", { "enforceForClassFields": false }] */

class A {
    foo = () => {}
}
1
2
3
4
5

ignoreOverrideMethods

"class-methods-use-this": [<enabled>, { "ignoreOverrideMethods": true | false }]
1

The ignoreOverrideMethods option ignores members that are marked with the override modifier. (default: false)

Examples of incorrect TypeScript code for this rule with the { "ignoreOverrideMethods": false } option (default):

/*eslint class-methods-use-this: ["error", { "ignoreOverrideMethods": false }] */

abstract class Base {
    abstract method(): void;
    abstract property: () => void;
}

class Derived extends Base {
    override method() {}
    override property = () => {};
}
1
2
3
4
5
6
7
8
9
10
11

Examples of correct TypeScript code for this rule with the { "ignoreOverrideMethods": false } option (default):

/*eslint class-methods-use-this: ["error", { "ignoreOverrideMethods": false }] */

abstract class Base {
    abstract method(): void;
    abstract property: () => void;
}

class Derived extends Base {
    override method() {
        this.foo = "Hello World";
    };
    override property = () => {
        this;
    };
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

Examples of correct TypeScript code for this rule with the { "ignoreOverrideMethods": true } option:

/*eslint class-methods-use-this: ["error", { "ignoreOverrideMethods": true }] */

abstract class Base {
    abstract method(): void;
    abstract property: () => void;
}

class Derived extends Base {
    override method() {}
    override property = () => {};
}
1
2
3
4
5
6
7
8
9
10
11

ignoreClassesWithImplements

"class-methods-use-this": [<enabled>, { "ignoreClassesWithImplements": "all" | "public-fields" }]
1

The ignoreClassesWithImplements ignores class members that are defined within a class that implements an interface. The option accepts two possible values:

• "all" - Ignores all classes that implement interfaces
• "public-fields" - Only ignores public fields in classes that implement interfaces

Examples of incorrect TypeScript code for this rule with the { "ignoreClassesWithImplements": "all" }:

/*eslint class-methods-use-this: ["error", { "ignoreClassesWithImplements": "all" }] */

class Standalone {
    method() {}
    property = () => {};
}
1
2
3
4
5
6

Examples of correct TypeScript code for this rule with the { "ignoreClassesWithImplements": "all" } option:

/*eslint class-methods-use-this: ["error", { "ignoreClassesWithImplements": "all" }] */

interface Base {
    method(): void;
}

class Derived implements Base {
    method() {}
    property = () => {};
}
1
2
3
4
5
6
7
8
9
10

Examples of incorrect TypeScript code for this rule with the { "ignoreClassesWithImplements": "public-fields" } option:

/*eslint class-methods-use-this: ["error", { "ignoreClassesWithImplements": "public-fields" }] */

interface Base {
    method(): void;
}

class Derived implements Base {
    method() {}
    property = () => {};

    private privateMethod() {}
    private privateProperty = () => {};

    protected protectedMethod() {}
    protected protectedProperty = () => {};
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

Examples of correct TypeScript code for this rule with the { "ignoreClassesWithImplements": "public-fields" } option:

/*eslint class-methods-use-this: ["error", { "ignoreClassesWithImplements": "public-fields" }] */

interface Base {
    method(): void;
}

class Derived implements Base {
    method() {}
    property = () => {};
}
1
2
3
4
5
6
7
8
9
10

Version

This rule was introduced in ESLint v3.4.0.

Further Reading

Classes - JavaScript | MDN
developer.mozilla.org

static - JavaScript | MDN
developer.mozilla.org

Resources

• Rule source
• Tests source