The "this" keyword in JS

Nguyễn Huy Hùng

Education Section, Human Development Division

  1. Misconceptions about "this"
  2. Call-site
  3. Four rules
  4. Exceptions
  5. Summary

1. Misconceptions about "this"

1.1 Why "this"?

1. Misconceptions about "this"

1.2 Confusions: itself

1. Misconceptions about "this"

1.2 Confusions: its scope

1. Misconceptions about "this"

1.3 What's "this"?

2. Call-site

3. Four rules

3.1 Default Binding

3.2 Implicit Binding

3. Four rules

3.3 Explicit Binding

3. Four rules

3.4 "new" Binding

3. Four rules

4.1 Ignored "this"

4. Exceptions

4.2 Indirection

4. Exceptions

4.3 Softening Binding

4. Exceptions

Determining the this binding for an executing function requires finding the direct call-site of that function. Once examined, four rules can be applied to the call-site, in this order of precedence:

  1. Called with new? Use the newly constructed object.

  2. Called with call or apply (or bind)? Use the specified object.

  3. Called with a context object owning the call? Use that context object.

  4. Default: undefined in strict mode, global object otherwise.

5. Summary

The "this" keyword in JS

By Nguyễn Huy Hùng

The "this" keyword in JS

  • 60