Syntax - Tasty Web Development Treats

Hasty Treat - Seven Interesting JavaScript Proposals - Async Do, JSON Modules, Immutable Array Methods, and More!

Share this episode
Anyone with this link can open it.
Share Link
Start at 0:00

This episode isn’t summarized yet

Create a free account and summarize it. In a few minutes you’ll have the key takeaways and a section-by-section summary.

Show notes

In this Hasty Treat, Scott and Wes talk about seven new JavaScript proposals — what they do, where they’re at, and how you might use them.
Deque - Sponsor Deque’s axe DevTools makes accessibility testing easy and doesn’t require special expertise. Find and fix issues while you code. Get started with a free trial of axe DevTools Pro at deque.com/syntax. No credit card needed.
LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.
Show Notes 03:32 - Seven new JavaScript proposals
https://github.com/tc39/proposals

06:25 - JSON Modules
https://github.com/tc39/proposal-json-modules

Builds on the import assertions
No named exports
Not executed, to avoid security issues
Not in Node yet
09:55 - Array Find From Last
https://github.com/tc39/proposal-array-find-from-last

The problem: you need to group together async code.The only way to do that right now is to wrap it in a function.
11:40 - Async Do
https://github.com/tc39/proposal-async-do-expressions

Async do will allow you to group together a block of code and mark it as async.
No need for an iife
Downside to this is that it’s a code block, so if you need to return any values, you’ll need to jump that up a scope level.
Promise.all([ async do { let result = await fetch('thing A'); await result.json(); }, async do { let result = await fetch('thing B'); await result.json(); }, ]).then(([a, b]) => console.log([a, b])); 14:33 - Change Array By Copy
https://github.com/tc39/proposal-change-array-by-copy

Like old array methods, but returns a new array rather than mutating
17:48 - Temporal
https://github.com/tc39/proposal-temporal

Stage 3, looking good!
Amazing, large, very good Date API
Syntax 295: Hasty Treat — Temporal Date Objects in JavaScript

18:35 - As Patterns
https://github.com/zkat/proposal-as-patterns

Scott don’t get it
Stage 0
when ([ ‘go’, (‘north’ | ‘east’ | ‘south’ | ‘west’) as dir ]) { … }
20:47 - Pattern Matching
https://github.com/tc39/proposal-pattern-matching

VERY Rust-like https://doc.rust-lang.org/1.6.0/book/patterns.html

Stage 1
{props => match (props) { when ({ loading }) { ; } when ({ error }) { ; } when ({ data }) { ; } }} 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

Couldn't load the audio. A blocker may be stopping the show's tracking links. Open the file