0

An example will better illustrate my question.

let obj = { 
    columns: [
        { column: name },
        { column: name },
        { column: name },
        { column: name },
        { column: name }
    ],
    someFunc: () => {
        this.somePublicFunc(this.columns[0])
    }
}

With a regular function() the this.columns would point to obj.columns. Is there a way at access the function this scope within a fat arrow function?

Alternatively can I call a public function in a non-fat arrow function?

    someFunc: function() {
        this.somePublicFunc(this.columns[0])
    }

Edit: I know I can access obj.columns, but was looking for other options as this is not the most elegant option for the actual code.

Edit: This was all the result of quickly changing all the public methods over to arrow functions. The thought never even occurred to me to just change the problem method in question to a traditional non fat arrow function. Problem solved, ego bruised.

Ian Hoar
  • 1,134
  • 19
  • 35
  • 1
    `In vanilla JavaScript the this.columns would point to obj.columns` No, it wouldn't. Typescript arrow functions work the same as Javascript arrow functions. – SLaks Dec 06 '17 at 17:24
  • `can I call a public function in a non-fat arrow function` Of course. Why wouldn't that work? – SLaks Dec 06 '17 at 17:24
  • SLaks is right. TypeScript is just a superscript of JS. You can write JS all day long in TS. Valid JS is valid TS. – Muirik Dec 06 '17 at 17:25
  • I know TypeScript is a superset of JS. If you look at both someFunc examples you will see one is a fat arrow and one is a regular function. this points to a different this in both of these. My question is how I can access both from within the same function. Also vanilla is the wrong word, but in a regular function as seen below this.columns does indeed point to obj.columns. Removed TypeScript references. – Ian Hoar Dec 06 '17 at 17:36
  • 1
    "*Is there a way to do this with arrow functions?*" - No. Arrow functions can't be used as methods. – Bergi Dec 06 '17 at 17:53
  • Btw, in your example code there is no `somePublicFunc` anywhere, you might want to fix that – Bergi Dec 06 '17 at 17:54
  • It's not relevant. I just wanted to know if you could access a public function, which you have answered. I was going to answer this question but someone closed it, so I'll add it here. This was part of a quick refactor where all methods were converted to => syntax. The simplest solution which did not occur to me until now was to find the public function and not use arrow syntax on it. Yes I feel silly. :D – Ian Hoar Dec 06 '17 at 18:17

1 Answers1

2

Remember that arrow functions determine their this base upon the current this at the time the function is declared and not base upon its placement within an object.

In your code above, assume it is running globally, the this pointer will be window in a browser and global in node when the function someFunc was declared so that will be the this pointer inside of the arrow function.

In general, using a traditional function declaration will resolve your problem, unless this gets changed by something else.

Intervalia
  • 8,536
  • 1
  • 21
  • 47
  • I'd like to use the traditional function declaration, that how the code currently is, but then I'm not sure how to access the public function. – Ian Hoar Dec 06 '17 at 18:02
  • You access it through your object like this: `obj.someFunc();` – Intervalia Dec 06 '17 at 18:03
  • Was afraid that was the answer and started down that path before posting this. The actual code is not as simple as my example unfortunately. – Ian Hoar Dec 06 '17 at 18:07