Why is 'this' equal to 'Window' in my prototype function?

Question

I have a prototype function written on the Array class like

Array.prototype.myfunc = () => 
{
   // ... 
}

and within the body this is referring to window when I call it on an array like

var result = [1, 69, -1, 1].myfunc();

How can I make it refer to the array on which it's being invoked?

Why do you use lambdas BTW? They're still not supported by many browsers. — Bálint, Jul 11 '16 at 00:47
Related: [Arrow function vs function declaration / expressions: Are they equivalent / exchangeable?](http://stackoverflow.com/q/34361379/218196) — Felix Kling, Jul 11 '16 at 03:32

Daniel A. White · Accepted Answer · 2016-07-11T00:48:45.770

5

The () => { } arrow syntax binds to the current this which likely is window (depending on when you assign the function).

edited Jul 11 '16 at 00:48

answered Jul 11 '16 at 00:42

Daniel A. White

score 2 · Answer 2 · answered Jul 11 '16 at 00:42

The fat arrow syntax in ES6 is an implicit bind to the current scope.

If your current scope is Window (or the global scope), then the function you just set on the prototype is bound to that scope.

You still need the good ol' function () syntax for behavior without binding.

score 1 · Answer 3 · answered Jul 11 '16 at 00:42

1

Just don't use arrow function here, arrow function inherits context from the parent scope.

Array.prototype.myfunc = function() {
   // ... 
}

answered Jul 11 '16 at 00:42

Max Brodin

Angel Politis · Answer 4 · 2016-07-11T01:09:36.997

What's causing your issue is the use of an arrow function.

In arrow functions, the this keyword may reference to:

To fix your issue, you have to use a "normal" function() and you can call your function using call(this, ...params):

So, with the above in mind, your code can be as shown:

Array.prototype.myfunc = function(...) {
   // Your code
}

var array = [1, 69, -1, 1];
var result = myfunc.call(array, ...);

Using array as the first argument in call(), you bind the this keyword to array.

4 Answers4