Pure Functions in JavaScript

Welcome to my blog ππ½
I'm a Front-End Developer with a passion for learning!
I write about Programming π©π½βπ» and Productivity Tips β
Search for a command to run...

Welcome to my blog ππ½
I'm a Front-End Developer with a passion for learning!
I write about Programming π©π½βπ» and Productivity Tips β
Although my experience is primarily with front-end development, my current job is affording me the opportunity to do more full-stack work. Naturally, this meant that I needed to explore the different database GUIs available on the market. Here is a l...

A Note on the Series: Fast Fridays π is a series where you will find fast, short, and sweet tips/hacks that you may or may not be aware of. I will try to provide these (fairly) regularly on Fridays. In this Fast Friday tip, I'll explain how to crea...

Over the past year, Iβve started incorporating a Git GUI into my workflow. I still reach for the terminal about 90% of the time, but Iβve found that a GUI can really shine when it comes to things like viewing diffs, checking stashes, or resolving mer...

Simplifying Branch Management with Git Worktree

With all the AI tools popping up these days, I figured I'd try out some speech-to-text software in an attempt to boost my productivity. I've been hearing a lot about βdeveloping at the speed of thoughtβ, so here's a list of the top speech-to-text sof...

Functional programming is a programming paradigm that's been gaining a lot of traction in JavaScript. One of the core concepts of functional programming is pure functions and writing declarative vs. imperative code. In this article, I'll define what pure functions are, why they're beneficial, and how to construct them.
Pure functions consist of the following two concepts:
The main gist is that pure functions typically accept parameters and, if they perform an action on said parameters, they do NOT directly mutate data. Instead, it creates a copy or new version of the data that it is referencing and operates off of that.
As the name implies, side effects are actions that happen as a result of a function being invoked. In order for a function to be considered "pure", it cannot cause any side effects.
Here's a non-exhaustive list of things that can produce side-effects:
console.log()pop() or push() or adding properties to objects. To avoid this, it's best practice to create a copy of the array or object coming in and then modify the copy.One of the biggest benefits of pure functions is their predictability. Because we know that given the same input we will always produce the same output and that there will be no side effects, the developer can trust that this function is reliable to use. Since pure functions are modular little pieces of code that can be ported around it makes them very composable and also makes them easier to test and it can help in mitigating bugs.
The best way to demonstrate the differences between an impure and pure function is through an example so let's take a look at some code.
const numbers = [1, 2, 3, 4, 5]
//Impure Example
function removeLastItemImpure(){
numbers.pop()
return numbers
}
There are a few "pure rules" that are being broken:
removeLastItemImpure accepts no arguments and performs its operations on the numbers variable that is defined outside the scope of the function.Now let's take a look at how we can achieve the same result with a pure function:
const numbers = [1, 2, 3, 4, 5]
//Pure Example
function removeLastItemPure(arr) {
return arr.slice(0, arr.length - 1)
}
arr, that it can work with so that we are no longer referencing variables outside the function's scope. pop() method which directly modifies an array, we leverage the slice() method which returns a shallow copy of a new array containing the extracted elements.The plain and simple answer is "no." For an application to be interactive and do useful things, there needs to be some form of state. Customers fill out forms, a computer game takes you to different levels based on checkpoints, the DOM needs to change to display different things, etc. A website or application without any side effects would be pretty boring.
Side effects and impure functions are not necessarily bad. In fact, it's darn near impossible to create a useful application that doesn't have some form of side effects. However, the goal should be to isolate these side effects to a certain location in your code so that you know when to expect particular outcomes.
Composing pure functions together is a big part of functional programming and can provide a lot of benefits to a codebase.
If you enjoy what you read, feel free to like this article or subscribe to my newsletter, where I write about programming and productivity tips.
As always, thank you for reading, and happy coding!