1

Why different value of arguments inside and outside foo function

In this following code I don't understand why arguments[0] prints 3 inside foo function, solution of this problem just gives hint:

You need to check whether arguments exists in DOM or not

Obviously arguments is inside DOM. Or am I missing something?

var arguments = [1, 2, 3];
var arr = () => arguments[2];
arr()
console.log(arr()); // understandable it prints 3
console.log(arguments[0]);// understandable it prints 1

function foo(n) {
console.log(arguments[0]); // do not understand why it prints 3
   var f = () => arguments[0] + n; 
   return f();
}
console.log(arguments[0]); // understandable it prints 1
foo(3); 

Submitted July 19th 2021 by Admin

Answers
0

arguments has a special meaning in some circumstances: it refers to the arguments passed to the closest ancestor function. For this reason, it's a good idea to never define variables named arguments to avoid confusion. Try it:

const arr = [1, 2, 3];
const someFn = () => arr[2];
someFn()
console.log(someFn());
console.log(arr[0]); function foo(n) { console.log(arr[0]); const f = () => arr[0] + n; return f();
}
foo(3);
console.log(arr[0]);

and the reason behind each log should be clear as day, since there now isn't any funny business going on.

The problem with your original code is, when you do:

function foo(n) { console.log(arguments[0]); // do not understand why it prints 3

The nearest enclosing (non-arrow) function that the arguments refers to is the foo function, and all arguments are collected into an array-like object and put into an arguments identifier. The above snippet is similar to doing:

function foo(n) { const theArgs = [n]; // collect all arguments into an array-like object console.log(theArgs[0]); // do not understand why it prints 3

And since the call of foo was foo(3), theArgs is [3], so theArgs[0] contains 3.

Admin | 1 week ago


0

arguments is a special keyword in Javascript. arguments is an Array-like object accessible inside non-arrow functions that contains the values of the arguments passed to that function.

It has a special meaning only in that scope.

Even when you do not pass any parameters, the object exists.

let arguments = [0,1,2,3];
function func1() { console.log(arguments); console.log(arguments[0]);
} //Arrow functions do not have special arguments object
let func2 = () =>{ console.log(arguments); console.log(arguments[0]);
} func1(1, 2, 3);
func2(1,2,3);

An arrow function does not have its own arguments object. So here when referring to arguments you refer to the arguments defined outside it.

Admin | 1 week ago


0

That is because argument in method is your argument of method. Simply change the name:

 var arguments1 = [1, 2, 3]; var arr = () => arguments1[2]; arr() console.log(arr()); // understandable it prints 3 console.log(arguments1[0]);// understandable it prints 1 function foo(n) { debugger console.log(arguments1[0]); // do not understand why it prints 3 var f = () => arguments1[0] + n; return f(); } console.log(arguments1[0]); // understandable it prints 1 foo(3)

Admin | 1 week ago



Relevant Questions