Can't get `arguments` of inner arrow function

Question

I was making a decorator function in response to this question when I realized it was not working as expected. The function simply counts how many times given function is called, and logs it.

function countExecutions(fn) {
    let count = 0;
    return () => {
        console.log("called",++count);
        return fn.apply(this, arguments);;
    }
}

var test = countExecutions((a,b) => a+b);
var x = test(1,2);
console.log(x); // (a,b) => a+bundefined

I realized this is because arguments refer to the arguments of the function countExecutions instead of my inner anonymous function. So it logs (a,b) => a+bundefined instead of 3. Why can't I get arguments of inner anonymous function?

If I give it a name, it works as expected:

function countExecutions(fn) {
    let count = 0;
    return function inner() {
        console.log("called",++count);
        return fn.apply(this, arguments);;
    }
}

var test = countExecutions((a,b) => a+b);
var x = test(1,2);
console.log(x); // 3

should also work without naming it - just doing a normal `function() {}` — acupofjose, Jan 26 '18 at 19:19
Oh that's right!! So it's not about it being anonymous, just being arrow — RaphaMex, Jan 26 '18 at 19:19
Possible duplicate of [How to access Argument object inside arrow function](https://stackoverflow.com/questions/47068640/how-to-access-argument-object-inside-arrow-function) — jhpratt, Jan 26 '18 at 19:20
@jhpratt: my question is close to that one, but I got more helpful answers. So I prefer not mark it as duplicate. Thanks! — RaphaMex, Jan 26 '18 at 19:35

Cody Ｇ · Accepted Answer · 2018-01-26T19:35:43.093

3

I think you're misunderstanding arrow functions, here's your anonymous (not using the arrow function) version:

(Alternatively you can use arrow functions as noted in @trincot's answer. )

function countExecutions(fn) {
    let count = 0;
    return function(){
        console.log("called",++count);
        return fn.apply(this, arguments);;
    }
}

var test = countExecutions((a,b) => a+b);
var x = test(1,2);
console.log(x); // (a,b) => a+bundefined

edited Jan 26 '18 at 19:35

answered Jan 26 '18 at 19:18

Cody Ｇ

8,368
2
35
50

Could you add @trincot 's alternative to complete your answer? Would be great for future similar questions. – RaphaMex Jan 26 '18 at 19:33

score 2 · Answer 2 · answered Jan 26 '18 at 19:22

As stated, arguments is not defined for arrow functions. But why not use the spread syntax:

function countExecutions(fn) {
    let count = 0;
    return (...args) => {
        console.log("called",++count);
        return fn.apply(this, args);
    }
}

var test = countExecutions((a,b) => a+b);
var x = test(1,2);
console.log(x); // 3

score 1 · Answer 3 · answered Jan 26 '18 at 19:19

It doesn't behave this way due to the function being named, but because you're using an arrow function. Arrow functions not only do not define their own function scope, but also no arguments:

An arrow function expression has a shorter syntax than a function expression and does not have its own this, arguments, super, or new.target. These function expressions are best suited for non-method functions, and they cannot be used as constructors.

Source

Can't get `arguments` of inner arrow function

3 Answers3