this: taking JavaScript out of Context

on YouTube ↗15m

" summary

Shows that a function in JavaScript can act as a constructor, method, or plain function depending on how it’s called, so the value of this is decided by the call site (look to the left of the dot). Demonstrates using bind/call/apply to lock context, replacing constructors with factory functions that use closures for private state, and using arrow functions to avoid accidental this rebinding; includes concrete examples of click handlers, setTimeout callbacks and a makePerson factory.

AI-written summary · about

" chapters (16)

1. 0:00Start
2. 2:12F*CKING JAVASCRIPT
3. 3:00When the function is called, Look to the left of the dot.
4. 3:36What's really going on?
5. 3:54Hint: Schrödinger's cat
6. 4:45Question: How do we define methods?
7. 5:09If everything is a function...
8. 5:35constructor: new sayHiO
9. 6:02called in three different ways
10. 7:10Passing a callback to someone else?
11. 7:58Can we explicitly set this?
12. 10:19For example, Bespoke.js
13. 11:25Functions return objects, powered by closures
14. 12:02Functions: The Good Parts
15. 12:46Arrow functions
16. 14:28brother Look to the left of the dot.

" related talks

• 57mUnderstanding Functions and "this" in the World of ES2018Bryan Hughes · Silicon Valley Code Camp 2018
• 15mJavaScript: Getting ClosureMark Dalgleish · Web Directions Code 2012
• 44mJavaScript - From Birth to ClosureRobert Nyman · JSConf.eu 2009
• 39mJavascript for people who didn't learn JavascriptJesse Wolgamott, jesse wagemont · LoneStarRuby Conf 2011
• 51mECMA 6 JavaScript, the Good PartsJennifer Estrada · NDC Minnesota 2019
• 54mPatterns for Programming in JavaScriptVenkat Subramaniam · Great Indian Developer Summit 2015
• 51mAdvanced Javascript Basics for Web DevelopersLauren Voswinkel · Open Source Bridge 2014
• 29mThe JavaScript Interpreter, InterpretedMartha Girdler · Strange Loop 2013