Question 25 / 31

Why does calling arguments[0]() read this.length as 3?

Topic: this bindingDifficulty: Advanced

Calling a value through a member expression binds this to whatever object that expression was read off — even the current call's own arguments object.

Solve it with the execution visualizerStep through every binding, function call, and console output below.

Predict the output

Predict the output. callback is called through arguments[0](), not as a bare callback() — does that change what this.length reads?

var length = 4;
function callback() {
  console.log(this.length);
}

const object = {
  length: 5,
  method() {
    arguments[0]();
  }
};

object.method(callback, 1, 2);
Reveal the answer and explanation

Expected output

3

Why this happens

object.method(callback, 1, 2) calls method with three arguments, so method's own arguments object has arguments.length === 3, holding callback, 1, and 2 at indices 0, 1, and 2.

arguments[0]() is a member-expression call: the callee is read off arguments via a computed property access, so implicit binding applies with the receiver being that member expression's base — the arguments object itself, not callback's own (separate, freshly created, empty) arguments object.

Inside callback, this is therefore method's arguments object, and this.length reads its length property, 3 — not the outer var length (4), and not the object literal's length property (5), which implicit binding never even considers here.

What this question tests

  • implicit binding depends on the call's syntax, not on which function happens to run
  • the arguments object is an ordinary object argument-callers can bind this to, exactly like any other receiver
  • a function invoked via arguments[i]() gets its own, separate arguments object once it starts running — this is bound to the outer one, not the inner one

Runtime assumptions

Assumes a classic sloppy-mode script with a non-arrow, non-strict callback, so implicit binding is free to bind this to the arguments object read off.

Specification references

JavaScript Code EditorDirectly edit or paste custom code
Step 0 of 0
StepSpaceRun
Press → (Step) or Space (Run)
Phase 1: Compilation(Hoisting & Memory Setup)
Phase 2: Execution(Line-by-line Evaluation)
Execution Step Breakdown

Press "→" / click "▶" to step line-by-line, or press "Space" / click "▶ Run" for auto-play.