Getting this as undefined when using arrow function
I'm using arrow functions and I'm debugging with Chrome and Firefox Dev Tool. I am getting, this as undefined, even though the code still works.
My assumption is, that it has something to do with source-maps.
Here are the tools I use in order to build the my code:
- webpack (devtool: eval)
- babel-loader (es5 preset)
- typescript-loader
Answers:
The problem is that the chrome debugger believes that the this in the source code refers to the run-time this, but this inside a arrow function in typescript source code is actually transformed to _this, so it's showing you the wrong object.
This is why it's only a problem in the debugger and the code still works fine. When I need to debug something where this is a problem, I just copy it to the console and prepend it with an underscore.