Introduction to Functional Programming

#javascript #functional #react

In Functional Programing, we want express our whole program in terms of functions.
Functional Programing is Declarative. Which means we focus more on ** what to do ** instead of How to do

First lets understand why Functional Programming is so important.
Functional Programming enables us to

Write re-useable code.
Debug easily.
Read better.

Functions are 1st Class Citizens
because functions can be :

Assigned to variables.
Can be added to objects and arrays as well .
Sent to other functions as a argument.
Can be Returned from other functions.

Let's get right into it.

Non Functional Way

let name = "Sayuri" ;
let message = "Hey, fellow devs, I am " ;
console.log(message + name)

---> Hey, fellow devs, I am Sayuri

Functional Way

function message(name) {
    return "Hey, fellow devs, I am " + name ;
}

message("Sayuri")

---> Hey, fellow devs, I am Sayuri

--> Pure Functions

A Pure Function is a function which,
Given the same input, will always return the same output.

A Pure Function :

Takes in at least 1 parameter.
Return Something (A value or a function).
Does not mutates any arguments.

Not Pure

let name = "Sayuri" ;

function message(){
    console.log("Hey, fellow devs, I am " + name )
}

The above code is not pure because

--> It is not taking name as an parameter.
--> It's dealing with something in the global scope.
--> Also it not having a return value.

Pure Functions have no side effects which means it cannot alter anything outside the function.

Pure Function

function message(name) {
   return "Hey, fellow devs, I am " + name
}

Higher Order Function

A higher order function is a function that takes a function as an argument, or returns a function or does both.

const greet = function takeName (name){
    return function message(msg){
        return msg  + name 
    }
}

greet("Sayuri ")("Hey, fellow devs, I am ")

--> Hey, fellow devs, I am Sayuri

Immutable Code

Immutability means can't be changed.

Mutation --> (Bad)

const code= [ "Javascript", "Python", "React" ]
code[ 2 ] = "Node"
console.log(code)

--> [ "Javascript", "Node", "React" ]

Immutation

const code = [ "Javascript", "Python", "React" ]
const code2 = code.map(lang=> {
  if(lang=== 'Python') {
    lang= 'Node';
  }
  return lang;
});

console.log(code2)

--> [ "Javascript", "Node", "React" ]

Last but not the Least
Do not Iterate using for or while/loops --> Use Map, Reduce, Filter etc.

Let me your thoughts.

Top comments (5)

Casper • Feb 24 '21

let name = "Sayuri" ;
let message = "Hey, fellow devs, I am " ;
console.log(message + name)

Do you consider this non-functional because it's all written in the global scope? Because I don't really see anything else that would make it non-functional. It doesn't mutate and doesn't access variables in an outer scope (since there is none). I would say it's completely functional.

function greet(){
    let name = "Sayuri" ;
    let message = "Hey, fellow devs, I am " ;
    console.log(message + name)
}

Is this still non-functional? Impure functions are still allowed in functional programming btw. But should be kept to a minimum.

A pure function also doesn't have to take an argument. Although if it doesn't it's just a constant function, always returning the same value. But by definition, it is still pure.

Jack • Mar 1 '21

Agreed. I can only assume that first example because it's logging to the console (side effect).

Yes there can be minimal impure functions because otherwise your code would do nothing. But I'd say if a function is impure, you should look for a way to make it pure, and only leave it impure as a last resort, most of the time function composition/partial application is the key.

Your greet function I would pass the console in as a parameter. Even better would be to create an abstraction over logging to the console so your function isn't coupled to the console implementation!