TypeError: Cannot read property 'hello' of undefined in JavaScript

Question

Hi I am trying to run below program. I have one function hello and I am calling it inside b. It gives me an error

TypeError: Cannot read property 'hello' of undefined

class ChildClass {
  // constructor
  constructor(param, ...args) {

    this.hello = function (a) {
      console.log(a);
    }

    this.obj = {
      a: {
        b() {
          this.hello(2)
        }
      }
    }
  }
}

Does anyone know what I am doing wrong here ?

`this` inside the `b()` function will point to the `this.a` object — Andrei CACIO, Sep 26 '17 at 07:55
`this` in the `b` method refers not to the object of the `ChildClass` — Suren Srapyan, Sep 26 '17 at 07:56
@AndreiCACIO Yup. How I can make such that `hello` is available inside b() — N Sharma, Sep 26 '17 at 07:57
Duplicate of https://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work. — , Sep 26 '17 at 08:00
Related: [How to access the correct `this` inside a callback?](https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback) — Felix Kling, Sep 26 '17 at 08:01
Technically we have to see how you are calling the function to what `this` will refers to. — Felix Kling, Sep 26 '17 at 08:02

score 1 · Accepted Answer · answered Sep 26 '17 at 07:59

The problem is that this isn't pointing to the ChildClass instance but to the inner a object. One solution might be:

class ChildClass {
  // constructor
  constructor(param, ...args) {

    const hello = this.hello = function (a) {
      console.log(a);
    }

    this.obj = {
      a: {
        b() {
         hello(2)
        }
      }
    }
  }
}

However if you don't intend to use hello() as an instance method, you can simply declare it in a private const and don't put it on this:

class ChildClass {
  // constructor
  constructor(param, ...args) {

    const hello = function (a) {
      console.log(a);
    }

    this.obj = {
      a: {
        b() {
         hello(2)
        }
      }
    }
  }
}

Depends on what you want to do.

Or, you can save the "real" this in a const:

class ChildClass {
  // constructor
  constructor(param, ...args) {
    const instance = this;

    this.hello = function (a) {
      console.log(a);
    }

    this.obj = {
      a: {
        b() {
         instance.hello(2)
        }
      }
    }
  }
}

TypeError: Cannot read property 'hello' of undefined in JavaScript

1 Answers1