Back to the future of JS

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 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

@wmsbill Two syntaxes Unary : :context.method() Binary context: :method()

@wmsbill Binary syntax

@wmsbill Unary syntax

@wmsbill

@wmsbill Bind operator is good for virtual methods But relies
on this to be bound

@wmsbill Composing without this

@wmsbill

@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 Function with more params

@wmsbill Awaiting a function

@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?

@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 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

@wmsbill Partial application proposal Creates two new parameters tokens ?
For single argument . . . for multiple parameters

@wmsbill Partial application syntax

@wmsbill With arbitrary parameter

@wmsbill The . . . token Spread the unbound parameters
Useful when you want to bound first or last parameter

@wmsbill The . . . token

@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?

@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 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

https://medium.com/@wmsbill https://twitter.com/wmsbill [email protected]

Dankeshön!

Back to the future of JS

Back to the future of JS

More Decks by Willian Martins

Other Decks in Technology

Featured

Transcript