Understanding Functions and "this" in the World of ES2018

on YouTube ↗57m

" summary

Explains that JavaScript sets this by how a function is called — call-site determines this — so plain function calls get global/window, object.method calls get the object, and callbacks like setTimeout lose the object. Covers call/apply/bind, shows arrow functions lexically bind this (call/apply/bind don’t affect them), notes the surprising ignored this when calling an arrow via call, and previews class field declarations with arrow methods to avoid React binding boilerplate and extra re-renders.

AI-written summary · about

" chapters (7)

1. 0:00Start
2. 8:42Function Expressions vs. Declarations
3. 12:10Named Function Expressions
4. 17:19Object Shorthand Notation
5. 28:10Class Field Declarations (Stage 3)
6. 38:27The Proper Way
7. 52:00Class Field Arrow Functions and React

" related talks

• 15mthis: taking JavaScript out of ContextMark Dalgleish · Web Directions Code 2014
• 09mWhat is 'this' in Vue?Colin DeCarlo · Vueconf.US 2022
• 51mECMA 6 JavaScript, the Good PartsJennifer Estrada · NDC Minnesota 2019
• 54mThe New Dragons in JavaScriptScott Allen · NDC Sydney 2016
• 01h 14mJavaScript the Grumpy PartsRob Richardson · ACCU 2021 Online
• 54mJavaScript Essentials for Programming with ReactVenkat Subramaniam · Developer Summit 2020
• 39mJavascript for people who didn't learn JavascriptJesse Wolgamott, jesse wagemont · LoneStarRuby Conf 2011
• 44mThings that every JavaScript developer should knowRachel Appel · FrontCon 2019