Press "Enter" to skip to content

ESNext Pipeline Operator – Fun Fun Function


good Monday morning today we are going

to explore the concept of pipeline pipes

is absolutely not a new concept it’s

built into the UNIX command prompt and

it’s very much part of that whole

ecosystem and how things work it’s also

a language with feature and built into

the syntax of f-sharp Oh camel Alexei

realm julia live script has it as well

there is a proposal to add the pipeline

operator to JavaScript but the dependent

operator really is just some nice

syntactic sugar so you can implement

pipelines in JavaScript very equally

yourself and that we’re going to do that

today pipe life is really not so much

language feature or or a technique as it

is a way of of thinking about data

processing and I want to spend a little

bit of time exploring that that as well

that is what we’re going to explore

today I am mpj and you are watching fun

fun function before we do anything else

is like to quickly show you what the

pipeline operator is in order to do that

we need some kind of an example function

let’s imagine that we have a capitalized

function oh we don’t need to imagine it

because I just pasted it so this this is

very straightforward what it does is

that it takes a string it takes the

first character of the string and makes

it an exit upper case let me use it for

you so that you are completely with me

ah cap better life and I need to say

hello and we take that out and it’s

hello

but with the first character made big

big what the pipeline operator allows us

to do is to call functions with a single

argument in a different way all right so

I’m going to under this write the

equivalent call using the pipeline

operator instead so I do

all right the string first and then I

write the the pipeline operator and then

I write capsule

here like that you won’t see the

executed here because it’s not part of

the language yet but but that’s all it

does

this has some implications and we’re

going to dive into those in a little bit

but first I would like to talk in

general about functional programming

I’ve mentioned this before on the show I

feel that the more functional

programming I do the better my habits as

a programmer becomes the thing that I

like about functional programming is

that it gets to the core of what

programming is I feel that when I’m

doing functional programming a lot of

the sluff that is in programming is

shaved away at its core a computer takes

a piece of data and transforms it into

another piece of data and a function a

pure function a function with no side

effects a function that just takes the

value and transforms it into another

value and does nothing else that is a

great analog for what what computers are

in object-oriented programming it feels

like there is like object orientation is

an abstraction of this data

transformation and then there are

abstractions made on top of that

abstraction and at some point it just

becomes these weird abstract factory

that you’re you’re building and

you’re so far away from the actual data

processing that you just can’t you can’t

reason about it there’s absolutely a lot

of abstraction in in functional

programming as well and you can do

absolutely horrible things there as well

but it feels to me that it lends itself

less to do that it just feels like

functional code is closer to the actual

concept of data processing it just to me

feels more natural to what it is that a

computer program does and I also say

this I realize that it sounds vague

maybe the example that we’re going to

look at will give you an idea of what

I’m talking about and maybe it won’t

we’ll see but that is the way I feel at

least about

programming before we proceed I would

like to bring in two more sample

functions let me delete this for now and

then bring in two new friends so double

say let me show you what these does

which is called X and then double double

double thing and let’s just say hello

what does what does that give us it

gives us hello hello and if I do X

exclaim and it just gives us hello with

an exclamation mark because the

screencast has a limited amount of space

I would like to refactor these into

arrow functions also because I just like

arrow functions alright cool as you see

when you have these single line

functions that have just one argument if

you just lends itself very very well to

two arrow functions oh I forgot to X

that variable this thing I’m doing where

I’m replacing the variable with X in

these short functions that is a personal

preference I really like it

but a lot of people don’t I I like it

because I feel it is sort of like using

pronouns and sentences in English for

instance if I ask a friend of mine where

did you put the key he can reply I put

it on the table instead of saying I put

the key on the table oh no my OCD sense

is tingling this double quotes needs to

be replaced with single quotes they’re

satisfied as I said before programming

is a lot about data processing or

transforming data into other data and

it’s also about composing things like

making things modular so these three

functions here oh oh my these hover

tooltips does anybody know how to

disable them what is the flag to disable

these these hover tooltips I have tried

to find it I just can’t I

so dumb anyway let’s try not to trigger

that all right so let’s bring this back

to pipelines these three are free

functions here they are these small

isolated components like modules of

logic this is the nice thing about

functional programming when you have

these these isolated parts that we can

compose and by compose I mean that we

can use them together in different ways

even though they are not at all aware of

the existence of each other the reason

why we can compose them is is really yes

that they are very simple and they are

pure ok so let’s see us double say this

thing first and then we also can a

device that and then we exclaim it and

it says hello hello and this is the way

functional programming is supposed to

feel like it’s just these small little

parts that are very simple that you

slot together and this works because the

function is a very simple contract it

just take some values and returns a

value and does very few things if these

were classes with complicated interfaces

coming from different sources it just

wouldn’t work to do this it yes it works

because functions are simple however

when you look at this it just feels a

little bit unnatural we should not try

to write code that looks like English

but it’s kind of nice if it reads in a

in a way that feels natural if I say

this out loud I go exclaim capitalized

double say hello it it’s kind of weird

because the way we are saying it is not

the actual way it’s being executed it

would be more natural if the the code

actually read

like what is happening in the order that

is it’s happening so it would be better

if it said something like I’ll take

hello and then double say it and then

capitalize it and then exclaim it

because that is what is happening so

let’s let’s write a pipeline function by

replying pipe beeline pipe and we want

it to look like this we wanted to have a

want to take the functions in sequence

then exclaim and then we would like to

call it with hello so what we want the

type line to do is to return a new

function that has composed these three

functions into a new function a pipeline

that yes takes a value at the starting

then just types it through all of these

functions and returns whatever comes out

at the end I’m not sure how to do about

pipeline should take some of functions I

guess and we want it to return another

function that takes take the value that

we want to transform first you can we do

this recursively that would be fancy

let’s see func

take the first function and then call it

with the value now there is a time and

place for recursion and I think that

this does not lend itself super well

let’s just do a four and we’re going to

call the function with the value and

computed loss

the salt look a sign that there and now

we want to call this with left for salt

well like this last result or the value

and then we want to return the last

result I think did I work I think it did

my god

so what you see here having a pipeline

function having access to that makes it

a little bit more natural to write these

things it we can now read the code from

like left to right top to bottom like

the first thing that happened is that it

doubles as the then it capitalizes then

it explains well we still have the hello

at the end but it’s still a bit better

by the way we don’t have to write the

pipeline function I just wrote it right

now because I want to show you that

there’s not much magic involved you can

instead use a functional library like

Ram de we’re going to do that cons are

required lambda and then we can use use

is our pipeline instead I think this

Python if you just point

oh it spike and then you know I can

remove this one we are added I just

wanted to show a little bit of the power

of composition because these things are

capitalized that feels like a very

general thing it feels like general to

humanity these things things specific to

our application but maybe there is there

is a library that has that it just

becomes like require low – I action all

hang on I need to import that create

note that all right now we have low –

and instead of doing using this

capitalise we just use the capitalise of

of low – hang on

and I cannot delete Caroline and lower

the whole it still works and again the

reason why this works so seamlessly is

that these functions are very simple

they are both simple in sense that they

are just plain functions they are not a

classes with some specific interface

that you have doing sin shade or

anything they are just a plain function

that takes a value and returns a value

and it does very few operations on it

and it doesn’t have any side effects

it’s a very simple transform function

capitalize here is just a plain simple

pure function and that makes it

remarkably riu SFIL and composable the

more skeptical of you might be thinking

right now okay but these are all

functions that take a single argument

how does this play where the functions

that have have multiple arguments so you

like some let’s let’s do that let’s say

that there existed a a function that was

called it’s just cons append and the it

appended it character so it’s the a

generic version of exclaim but you can

expend any anti character so we it has

two arguments it has the string and it

has the know it has the character and it

has the string so it takes a string and

it append that the character that’s what

it does so that we we replace this well

Panch or mark and then the string and

then we have left low and now it we

imagine that exclaim does no longer

exist we just have a

Hanjour which is the function that takes

two arguments we can’t just paste that

in because that becomes super weird so

how do we provide a Penn char with this

this first argument well there this is

where arrow functions comes to the

rescue and I’m going to X and I’m going

to do a pinch our exclamation mark and

then X that’s the way you do it some

examples like to use lodash for this

like oh now it becomes really confusing

that this is named low – little just use

the proper name of the library there

like to use the little use the low – as

the the variable name I’m not sure what

I think about that it kind of makes it

look like a a form that hasn’t been

filled out which I like but mmm I I’m

more of an X X kind of guy I think let’s

delete this exclaim function we no

longer need it so perhaps now you are

seeing like why pipelines is an

interesting way of programming or

perhaps you don’t and you have left what

the pipeline operator does is allow us

to do this in the language without

writing our pipeline function or without

pulling in a library like Ram de having

it built into the language also slightly

not just people towards this way of

programming because it has it becomes

slightly more accessible and all it’s

also putting it into the language gives

it a certain sign off as well to do it

but either way let me show you what it

would look like with the pipeline

operator let’s remove Ram de and we’re

going to take low and we’re going to put

it at the start and then we’re going to

write a pipeline operator we’re going to

take double say

put it active at pipeline operator right

a new pipeline operator take low –

capitalize put it here then go to right

third pipeline operator and we’re going

to take the final one put it there and

then we’re done so these are showing up

as errors because this feature does not

exist yet in JavaScript it’s just a

proposal but this is the syntax that the

proposal is suggesting it also happens

to be the syntax in many of the

functional language is that that uses it

and let me paste in the RAM that example

so that you can compare them side by

side I think that this syntax is very

nice it shows very clearly that we are

taking hello and then we are piping it

to double say and then we are piping

that value to low – capitalized and then

we’re piping that value to this function

which appends the character exclamation

mark I like this proposal a lot one

could of course have many objections to

this for one thing it adds yet another

thingamabob to the JavaScript

specification yet another thing in the

language making it slightly harder to

learn then on the other hand I see like

very far gone proposals to add things

like private properties to two classes

and we I don’t I think that since we’re

pulling in if we’re pulling in stuff

from the object-oriented oriented

languages I think that it’s it’s not an

unhealthy thing to pull in features

really good features from solid

functional languages functional

programming is not the end-all be-all of

programming but I think that it’s safe

to say that we are looking at an

industry a little bit too much at

object-oriented programming and a little

bit too too little at at functional

programming I think it’s healthy to pull

few functional

what do you think about the pipeline

operator right

hey comments that is it for today you

have yet to watch an episode of fun fun

function I release these every Monday

morning Oh 800 GMT if you don’t want to

wait until next Monday morning you can

check out this machine learning

surprised that YouTube I selected for

you I am mpj until next Monday morning thank you

Please follow and like us: