BiteSizedChunks.comLearn one small thing at a time.

Course contentsShow

534What is 'this'?
535Dynamic Binding Explained
536Lexical Binding Explained
537Why 'this' Uses Dynamic Binding
538The Four Binding Rules Preview
539Lexical Variables vs 'this'
540When Lexical Binding Matters
541The Global 'this' Context
542Strict Mode's Effect on 'this'
543Confusion: Nested Functions
544'this' Is Not Self-Reference by Default
545Preview: Arrow Functions Break the Rules
546Method Calls: When 'this' is the Object
547Function Calls: When 'this' is Undefined (Strict Mode)
548Function Calls: When 'this' is Global (Non-Strict)
549Losing 'this' When Extracting Methods
550Implicit Binding Rules
551Callbacks and Lost Context
552The 'new' Keyword and Constructor Calls
553Method Calls on Computed Properties
554Chained Method Calls and 'this'
555Call-Site Determines 'this', Not Definition Site
556Debugging 'this' with Console Logging
557Why Manual 'this' Binding Exists
558The call() Method
559The apply() Method
560call() vs apply(): When to Use Each
561Borrowing Methods with call() and apply()
562The bind() Method
563Partial Application with bind()
564bind() for Event Handlers
565Binding Arrow Functions (Spoiler: It Doesn't Work)
566Chaining bind() Calls
567Performance Considerations
568Common Patterns: Method References
569When Not to Use Explicit Binding
570Arrow Functions Don't Bind 'this'
571Lexical 'this' vs Dynamic 'this'
572Arrow Functions as Methods
573Callbacks and Lexical 'this'
574Arrow Functions in Event Handlers
575Class Methods and Arrow Properties
576Arrow Functions Cannot Be Constructors
577No 'arguments' Object in Arrows
578When to Choose Arrow vs Regular Functions
579Debugging 'this' in Arrow Functions
580Losing 'this' When Passing Methods
581Event Handlers and 'this'
582SetTimeout and SetInterval Traps
583Array Methods and Callback Context
584Nested Functions Losing Outer 'this'
585Constructor Forgetting 'new'
586Class Methods as Callbacks
587Strict Mode and Undefined 'this'
588The 'var self = this' Pattern

534What is 'this'?
535Dynamic Binding Explained
536Lexical Binding Explained
537Why 'this' Uses Dynamic Binding
538The Four Binding Rules Preview
539Lexical Variables vs 'this'
540When Lexical Binding Matters
541The Global 'this' Context
542Strict Mode's Effect on 'this'
543Confusion: Nested Functions
544'this' Is Not Self-Reference by Default
545Preview: Arrow Functions Break the Rules
546Method Calls: When 'this' is the Object
547Function Calls: When 'this' is Undefined (Strict Mode)
548Function Calls: When 'this' is Global (Non-Strict)
549Losing 'this' When Extracting Methods
550Implicit Binding Rules
551Callbacks and Lost Context
552The 'new' Keyword and Constructor Calls
553Method Calls on Computed Properties
554Chained Method Calls and 'this'
555Call-Site Determines 'this', Not Definition Site
556Debugging 'this' with Console Logging
557Why Manual 'this' Binding Exists
558The call() Method
559The apply() Method
560call() vs apply(): When to Use Each
561Borrowing Methods with call() and apply()
562The bind() Method
563Partial Application with bind()
564bind() for Event Handlers
565Binding Arrow Functions (Spoiler: It Doesn't Work)
566Chaining bind() Calls
567Performance Considerations
568Common Patterns: Method References
569When Not to Use Explicit Binding
570Arrow Functions Don't Bind 'this'
571Lexical 'this' vs Dynamic 'this'
572Arrow Functions as Methods
573Callbacks and Lexical 'this'
574Arrow Functions in Event Handlers
575Class Methods and Arrow Properties
576Arrow Functions Cannot Be Constructors
577No 'arguments' Object in Arrows
578When to Choose Arrow vs Regular Functions
579Debugging 'this' in Arrow Functions
580Losing 'this' When Passing Methods
581Event Handlers and 'this'
582SetTimeout and SetInterval Traps
583Array Methods and Callback Context
584Nested Functions Losing Outer 'this'
585Constructor Forgetting 'new'
586Class Methods as Callbacks
587Strict Mode and Undefined 'this'
588The 'var self = this' Pattern

Lesson 574 of 2,723·14. The 'this' KeywordPro lesson

Arrow Functions in Event Handlers

When to avoid arrow functions in event handlers if you need 'this' to refer to the DOM element.

This lesson is for subscribers

You've completed the free preview. Subscribe to unlock every lesson in every course.

See pricing Back to course