Fundamentals of Functional Programming: Learn with JavaScript
Ryosuke Yano
Posted on August 5, 2023
Introduction
Functional Programming is a coding approach that treats computation as the evaluation of mathematical functions, avoiding state changes and focusing on creating maintainable, reusable, and robust code. It is well-suited for tasks like data transformation, mathematical computations, concurrent processing, asynchronous programming, and building code that is easy to maintain and test. In this article, we will explore the core concepts of functional programming in JavaScript, supported by practical code examples.
1. Pure Functions
Pure functions are the cornerstone of functional programming. They always produce the same output for the same input and have no side effects.
// Impure Function
let total = 0;
function impureAdd(num) {
total += num;
return total;
}
// Pure Function
function pureAdd(num1, num2) {
return num1 + num2;
}
2. Higher-Order Functions
Higher-Order Functions are functions that take other functions as arguments or return functions as values. They enable powerful abstractions and composition in functional programming.
// Higher-Order Function
function multiplyBy(factor) {
return function (num) {
return num * factor;
};
}
const double = multiplyBy(2);
const triple = multiplyBy(3);
console.log(double(5)); // Output: 10
console.log(triple(5)); // Output: 15
3. Immutability
Functional programming encourages immutable data structure to prevent unintended changes to the data.
// Mutable Approach
let mutableArray = [1, 2, 3];
mutableArray.push(4); // Changes the original array
console.log(mutableArray); // Output: [1, 2, 3, 4]
// Immutable Approach
let immutableArray = [1, 2, 3];
let newArray = [...immutableArray, 4];
console.log(immutableArray); // Output: [1, 2, 3]
console.log(newArray); // Output: [1, 2, 3, 4]
4. Recursion
Functional programming favors recursion over loops for iteration.
// Sum of an array using recursion
function sum(arr) {
if (arr.length === 0) return 0;
return arr[0] + sum(arr.slice(1));
}
const nums = [1, 2, 3, 4, 5];
console.log(sum(nums)) // Output: 15
5. Array Methods
JavaScript's Array methods like map
, filter
, and reduce
are essential for functional programming.
// Using map to double each element in an array
const nums = [1, 2, 3, 4];
const doubled = nums.map((num) => num * 2);
console.log(doubles); // Output: [2, 4, 6, 8]
// Using filter to get even numbers
const evenNumbers = nums.filter((num) => num % 2 === 0);
console.log(evenNumbers) // Output: [2, 4]
// Using reduce to get the sum of an array
const sum = nums.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // Output: 10
Conclusion:
Functional programming is a powerful paradigm that promotes writing predictable, modular, and scalable code. By embracing pure functions, high-order functions, immutability, recursion, and array methods, you can leverage the full potential of functional programming in JavaScript. Start applying these concepts in your projects to write cleaner and more maintainable code.
Posted on August 5, 2023
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.