Redux Functional Programming

Redux is build on top of principles of functional programming which is quite new to developers. To understand redux better we first need to learn few functional programming concepts.

1.What is functional programming?

Functional programming is one of the programming paradigms or styles such as:
Object-oriented
functional
procedural
Event-driven

In a nutshell, functional programming is about decomposing a problem into a bunch of small and reusable functions that take some input and return a result they don’t mutate or change the data. with this structure, we can compose multiple functions to create a complex function.

2.Advantages of using small functions:

1.More concise.
2.easier to debug.
3.easier to test.
4.more scalable.

3.Languages use functional programming:

1.clojure
2.hoskell
3.javascript(its a object based + functional programming language)

4.Functions as first-class citizens:

1.In javascript functions are first class citizens which means we can treat functions like any other variable/objects.we can assign them to a variable as shown below,

 function Hello(){
     return "hello";
 }
  
 let fun=hello;
  
 console.log(fun());

2.we can pass function as a arguments to the functions,

function Hello (){
        return "hello";
 }
  
 function greet(HelloMessage){
            console.log(HelloMessage());
 }
  
 greet(Hello);  // just need to pass the reference of hello

3.we can return function from other functions.

function hello(){
         return function(){
               return "hello";
        }
 }
  
 let  fun =hello();
 let message=fun();

5.Higher-Order functions:

A higher-order function is a function that takes a function as an argument or returns function or both. so functions instead of operating on numbers, string, booleans now operate on functions. we have already worked on higher-order functions such as,

1.map function:
the map function takes a function as an input hence it’s a higher-order function.

let numbers = [1,2,3,4,5];
numbers.map(num=>number*3);

2.setTimeout:
setTimeout is also a higher order function because it takes two arguments function & timeout period.

Example:

setTimeout(()=>{console.log("hello");},1000);

6.function composition:

we have studied that the idea of functional programming is to create a small & reusable function that can be composed together to create a complex function to solve real-world problems.

let text="     webdev99    ";

const trim= text=>text.trim();

const wrapInDiv =text =>`<div>${text}</div>`;

const result  = wrapIndiv(trim(text));

this is called functional composition where we have created a small function to solve a real-world big problem.

7.Pure Functions:

we call a function a pure function if we give it the same arguments it always returns the same result.

function myFunction(number){
   return number*2;
}

then which is a not a pure function ?

function myFunction(){
   return number*Math.random();
   }

the above function will generate random outputs for the same input as well hence not a pure function.

#Rules for pure function:

1. We cant use random values

2. We can’t use the current date & time.

3. We can’t read or change the global state like DOM elements files & databases etc.

4. We cant mutate parameters because it may cause the changing of the result.

In a redux application, reducers are the pure functions others may be impure.

#Benifits of pure functions:

1.pure functions are self-documenting because everything function needs are clearly specified.

2.Easily testable because we don’t use global state.

3.we can achieve concurrency using pure functions

4.pure functions are cacheable.

8.immutability:

once we create an object we can’t change it.

for Example: Strings in javascript & most of the programming languages are immutable.it means if you change the string it will create another copy of the object, the original object won’t get affected.

   let name="webdev99";
   let newName=name.toUpperCase();

In javascript objects and arrays are not immutable,we can change any of the property of object.

#props of immutability:

1.predictability of function.

2.faster change detection.

3.concurrancy.

# cons of immutablity:

1.Performance :
Every time we try to change the object it creates a copy and updates it..this is good for the small objects but for objects with thousands of properties, it creates performance issues.

2.Memory Overhead:
Every time copying multiple objects for updating them will cause a memory overhead issue.

Hope you are now clear with functional programming !!!

Let ,me know your queries in the comment section.

Thanks

Leave a Reply Cancel reply