Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

class Foo implements EventEmitter {
  on(name: string, fn: Function) { }
  emit(name: string) { }
const foo = new Foo();
foo.on('error', function(err: any) {
  console.log(err);
  this.emit('end');  // error: `this` implicitly has type `any`
Adding a typed this to the callback parameters results in the same error:
foo.on('error', (this: Foo, err: any) => { // error: `this` implicitly has type `any`
A workaround is to replace this with the object:
foo.on('error', (err: any) => {
  console.log(err);
  foo.emit('end');
But what is the proper fix for this error?
UPDATE: It turns out adding a typed this to the callback indeed addresses the error. I was seeing the error because I was using an arrow function with a type annotation for this:
                And I now see the reason WebStorm and TS playground were complaining: I was using an arrow function while providing a type annotation for this.
– tony19
                Jan 30, 2017 at 21:18
                I filed a bug here: github.com/Microsoft/TypeScript/issues/13768 - feel free to track it and give a thumbs up.
– Daniel Rosenwasser
                Jan 31, 2017 at 1:10
The error is indeed fixed by inserting this with a type annotation as the first callback parameter. My attempt to do that was botched by simultaneously changing the callback into an arrow-function:
foo.on('error', (this: Foo, err: any) => { // DON'T DO THIS
It should've been this:
foo.on('error', function(this: Foo, err: any) {
or this:
foo.on('error', function(this: typeof foo, err: any) {
                If your house key is broken doesn't mean you remove the lock. noImplicitAny is a good rule to enable. I think it is not a good idea to suggest switching something to false when it doesn't work. Should fix the code instead.
– Calvintwr
                Jan 22 at 14:12
                @Calvintwr I wouldn't have uploaded this as an answer if "noImplicitAny": true was working for me and the majority of other people
– Abduladil Sunnat
                Feb 25 at 11:28
                It works because you are switching off a TypeScript feature that is recommended to be turned on in the first place.
– Calvintwr
                Feb 25 at 14:25
For method decorator declaration
with configuration "noImplicitAny": true,
you can specify type of this variable explicitly depends on @tony19's answer
function logParameter(this:any, target: Object, propertyName: string) {
  //...
                He is not disabling type checking, he's allowing implicit any which in this very case might be borderline acceptable if that was all the code he had.
– Aquazi
                Oct 11, 2021 at 8:00
during angular development server starting I got this following error "Error: node_modules/grapesjs/index.d.ts:29:5 - error TS7010: 'each', which lacks return-type annotation, implicitly has an 'any' return type."
now when I got to this error file path, VS CODE IDE showing following error message on that each method hover 'each' implicitly has an 'any' return type, but a better type may be inferred from usage.ts(7050)
so I made following changes in the tsconfig.json file
// add or made change below option in the tsconfig.json file
"noImplicitAny": false,
Disabling the feature is not good idea but angular not allowed to run the project it shows error. So that I added the code and executed fine.
for more detailed explaination about the "noImplicitAny" option refer this
The function's this (not the arrow one) is usually set of type any if the parent object is from the DOM. you just have to specify the type parameter to the parent object.
For example:
document.querySelector(".button")?.addEventListener("click", function (e) { 
    this.classList.add("bg-yellow-500"); // 'this' implicitly has type 'any' because it does not have a type annotation.ts(2683)
In this case the typescript type checker can not assume the return type of the querySelector. To assert the type of this, add the generic type HTMLButtonElement:
document.querySelector<HTMLButtonElement>(".button")!.addEventListener("click", function (e) { 
    this.classList.add("bg-yellow-500");
This way vscode will also be happy :)
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.