Strange 'Cannot read property 'push' of undefined' error when array is already defined typescript

Question

I have a strange error when trying to push some strings to an array.

This might be a duplicate but I have found no answer in 50 threads..

Cannot read property 'push' of undefined.

Here is what I am trying to do:

public messageList = [];

receive = function(msg) {
  if (msg.length > 0) {
    this.messageList.push(msg);
  }
}

receiveis a callback from socket.io.

.. where msg is a string.

I also tried public messageList: Array<string> = []; without success..

What can I do?

EDIT: as someone pointed it out, the method is a callback from socket.io

`public messageList : string[] = [];` also use `if (msg && msg.length > 0)` — Joel Joseph, Jun 19 '19 at 12:20
thanks Joel, but it still won't work and I get the same error.. — Martin, Jun 19 '19 at 12:24
@Martin Can you please share the method which has your `if` statement and how are you calling that method. It appears that it is an issue of `this` scope. Please share the method and how are you calling it. — user2216584, Jun 19 '19 at 12:25
try console `this.messageList` before pushing message and post the answer here — Joel Joseph, Jun 19 '19 at 12:26
You should use an arrow function: `receive = msg => {` and drop the `function` keyword. Otherwise, does what @MrCode. advises — Cristian Traìna, Jun 19 '19 at 12:37
@CristianTraìna It works! Thank you very much, I will read your link thoroughly! — Martin, Jun 19 '19 at 12:41

Mr code. · Answer 1 · 2019-06-19T12:42:31.997

0

declare this as self then use self in callback function

e.g

 let self = this;
 public messageList = [];

 receive = function(msg) {
   if (msg.length > 0) {
     self.messageList.push(msg);
  }
 }

edited Jun 19 '19 at 12:42

answered Jun 19 '19 at 12:34

Mr code.

3

This is an old way, have it like: `receive = (msg) => { if (msg.length > 0) { this.messageList.push(msg); }`, this will preserve the `this` reference lexically. – Ashish Ranjan Jun 19 '19 at 12:37
@xyz agree. but as per is requirement I have suggested. – Mr code. Jun 19 '19 at 12:39
I also don't advise to use `_this` in TypeScript, since this is a reserved keyword inside the transpilers (to transpil `this` inside arrow functions). Using `self` would be better – Cristian Traìna Jun 19 '19 at 12:39
@xyz this made it work perfectly, I need to get into the documentation, Angular is heavy man! Thanks for your help – Martin Jun 19 '19 at 12:40
1

@CristianTraìna thanks will modify the ans. – Mr code. Jun 19 '19 at 12:40
1

@Martin This is not angular, this is JavaScript. – Ashish Ranjan Jun 19 '19 at 12:41
1

I am learning both at the same time – Martin Jun 19 '19 at 12:43

1 Answers1