Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Back to the future of JS
Search
Willian Martins
July 03, 2018
Technology
1
40
Back to the future of JS
This is an extended version of my talk I gave @ NodeJs Meetup in Berlin in July 2018
Willian Martins
July 03, 2018
Tweet
Share
More Decks by Willian Martins
See All by Willian Martins
De volta ao Futuro do JS: As próximas features e propostas incríveis
wmsbill
0
43
Back to the future of JS II: Beyond what we can foresee
wmsbill
0
70
A, B, C. 1, 2, 3. Iterables you and me.
wmsbill
0
64
Back to the future of JS II: Beyond what we can foresee
wmsbill
0
73
Back to the future of JS.
wmsbill
0
11
Node conf ar 2018.
wmsbill
0
320
Back to the future of JS
wmsbill
2
240
WebAssembly in NodeJS
wmsbill
4
530
WebAssembly the Journey
wmsbill
2
130
Other Decks in Technology
See All in Technology
GitHub最新情報キャッチアップ 2024年3月
dzeyelid
17
3.2k
OpenTelemetry実践 はじめの一歩
taxin
0
330
MongoDB Atlas Vectorsearchではじめる生成AIアプリ開発
chie8842
3
510
大規模データとの戦い方
knih
1
480
複数の LLM モデルを扱う上で直面した辛みまとめ
kazuyaseki
1
250
Autify Company Deck
autifyhq
1
30k
中央集権体制からDataOpsへの転換 / centralized-to-dataops-transformation
pei0804
7
1.5k
戦略的DDDを実践するための跳躍力 / OOC 2024
pictiny
6
4.2k
LLMプロダクト事業の立ち上げにおける挑戦
layerx
PRO
7
1.5k
HoneycombとOpenTelemetryでオブザーバビリティに入門してみる
sumiren
2
160
TypeScript Quiz (Encraft #12 Frontend Quiz Night)
uhyo
6
720
統計的学習理論読み Chapter 1
kmatsui
3
940
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
36
2k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
67
38k
Rebuilding a faster, lazier Slack
samanthasiow
72
8.2k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
Art, The Web, and Tiny UX
lynnandtonic
288
19k
A Modern Web Designer's Workflow
chriscoyier
689
190k
How STYLIGHT went responsive
nonsquared
92
4.7k
Atom: Resistance is Futile
akmur
258
25k
Learning to Love Humans: Emotional Interface Design
aarron
266
39k
Building Your Own Lightsaber
phodgson
97
5.6k
GraphQLの誤解/rethinking-graphql
sonatard
48
9.1k
Automating Front-end Workflow
addyosmani
1353
200k
Transcript
Hallo!
https://github.com/tc39/proposals
NodeJs Meetup
@wmsbill What is this?
@wmsbill this in the global scope Browser - window Web
worker - self NodeJS - module.exports
@wmsbill this inside a function?
@wmsbill this inside a function?
None
@wmsbill How to make this predictable? Reasoning the value of
this is tricky Function.prototype.bind Arrow function () => {}
With .bind()
With Arrow
@wmsbill Calling a knowing function
@wmsbill Extracting a method from an object
None
@wmsbill Two syntaxes Unary : :context.method() Binary context: :method()
@wmsbill Binary syntax
@wmsbill Unary syntax
@wmsbill
@wmsbill
@wmsbill
@wmsbill Bind operator is good for virtual methods But relies
on this to be bound
@wmsbill Composing without this
@wmsbill
@wmsbill
None
@wmsbill Pipeline operator |> It is a syntax sugar for
function composition It creates a way to streamline a chain of functions
@wmsbill Pipeline operator |>
@wmsbill
@wmsbill
@wmsbill
@wmsbill Function with more params
@wmsbill Function with more params
@wmsbill Awaiting a function
@wmsbill Awaiting a function
@wmsbill Awaiting a function
@wmsbill Awaiting a function
@wmsbill Awaiting a function
None
@wmsbill Smart pipeline
@wmsbill Smart pipeline Two types bare style and topic style
() or [] are disallowed in bare style When () or [] is needed, topic style is used # token is subject to change
@wmsbill What about curry?
None
@wmsbill F# pipeline proposal Extends the minimal proposal with an
await step Await step waits for the resolution of the previous step
@wmsbill F# pipeline proposal
@wmsbill
@wmsbill Partial application f(…) arity = n; partialapp(f(…)) arity =
m; m < n
@wmsbill
@wmsbill
@wmsbill Partial application in ES Achievable by Function.prototype.bind .bind() binds
context and parameters
@wmsbill
@wmsbill What about currying? We can achieve partial application with
curry Curry ≠ Partial application Curry returns arity n-1
@wmsbill
@wmsbill Partial application with arrow function
None
@wmsbill Partial application proposal Creates two new parameters tokens ?
For single argument . . . for multiple parameters
@wmsbill Partial application syntax
@wmsbill With arbitrary parameter
None
@wmsbill The . . . token Spread the unbound parameters
Useful when you want to bound first or last parameter
@wmsbill The . . . token
@wmsbill The . . . token
None
@wmsbill Partial application + pipeline
@wmsbill Partial application + pipeline
@wmsbill Should I use all of it in production? These
proposal are in very early stage The adoption of one, may change the syntax/semantics of other Not production ready (yet)
@wmsbill Let’s talk about something more solid?
None
@wmsbill [].flatMap syntax
@wmsbill [].flatMap syntax
[].flatMap x [].map
@wmsbill [].flatMap x [].map [].map guarantees the same array size
based on input [].flatMap doesn’t guarantees same array length as input array It could be used as filtering
@wmsbill [].flatMap as filter
@wmsbill #smooshgate
@wmsbill [].flatten
@wmsbill [].flatten syntax
@wmsbill [].flatten syntax
@wmsbill [].flatten syntax
@wmsbill So what is the deal?
MooTools
@wmsbill #smooshgate MooTools is an 11 years old ancient lib
They implemented [].flatten with different behavior The implementation + Elements Enhanced HTML component breaks the compatibility w/ [].flatten
https://youtu.be/loqVnZywmvw
@wmsbill TC39 had two options Change flatten to another name
(like smoosh) Break the internet
Array.prototype.flatten
Array.prototype.flatten
https://medium.com/@wmsbill https://twitter.com/wmsbill
[email protected]
Dankeshön!