In this Hasty Treat, Scott and Wes talk about whether decorators are finally here, what the uses cases are for decorators, how to define a decorator, and what auto accessor is.
Show Notes * 00:25 Welcome * 01:00 Are decorators finally here? * TC39 proposal * How this compares to other versions of decorators * 06:47 What are use cases for decorators? * 10:55 How do you define a decorator? * 14:20 Auto Accessor
on classes
@loggged class C {}
on fields
class C { @logged x = 1; }
Auto Accessor
class C { accessor x = 1; }
sugar for below
class C { #x = 1; // # means private get x() { return this.#x; } set x(val) { this.#x = val; } }
Can be decorated and decorator can return new get and set and init functions
function logged(value, { kind, name }) { if (kind === "accessor") { let { get, set } = value; return { get() { console.log(`getting ${name}`); return get.call(this); }, set(val) { console.log(`setting ${name} to ${val}`); return set.call(this, val); }, init(initialValue) { console.log(`initializing ${name} with value ${initialValue}`); return initialValue; } }; } // ... }
Tweet us your tasty treats * Scott’s Instagram
* LevelUpTutorials Instagram
* Wes’ Instagram
* Wes’ Twitter
* Wes’ Facebook
* Scott’s Twitter
* Make sure to include @SyntaxFM in your tweets
* Wes Bos on Bluesky
* Scott on Bluesky
* Syntax on Bluesky