DEV Community

Functional Programming Principles in JavaScript

Ankit Kumar on May 25, 2023

Before going to it’s principles, let first understand a bit about it. What is Functional Programming Functional programming is a paradi...

Read full post

Zelenya • May 26 '23 • Edited

Nice article 🙏

A minor note: mentioned drawbacks are mostly myths; for instance, can have performance issues isn't true. If the language performs poorly for some FP construct (usually, it should be optimized), it's a language issue, not some global FP issue.

Also, you can highlight the code snippets if you add the language after the ticks: '''javascript

Ankit Kumar • May 26 '23

Thanks for the suggestion and insightful information on drawbacks.

Bernd Wechner • May 26 '23 • Edited

My hands-on introduction to Functional programming has been OpenSCAD, building a 3D model of our house and land. Diving in, and my first realisation and introduction to the fact that it was Functional, was when I set a variable, and changed its value later, but found it had the latter value before I'd set it ... when it was used above that, when I expect it to have the first value set. Took a step back and whooooaa, did some reading and learned some. Then I remember well the next hurdle was that I couldn't write a loop, no iteration ... well, because containers are immutable (not variables per se at all) and so there is no for i ... as i has one value and one value only. So every thing you would instinctively do in a loop demands a recursive solution - and recursion takes on a whole new role, no longer a semi risky thing (of an overflowing a stack) but a central mechanic for solving any sort of repetitive problem.

It sure takes some getting used to, I'll grant that.

ymahendraa • Jun 2 '23

Thanks for made a great article pal

fruntend • May 29 '23

Сongratulations 🥳! Your article hit the top posts for the week - dev.to/fruntend/top-10-posts-for-f...
Keep it up 👍

Jon Randy 🎖️ • May 26 '23 • Edited

JS is fun...

const squareIt = (number) => {
    return number * number;
}
const myInput = { valueOf() { return performance.now() }}

console.log(squareIt(myInput)) // 6046681
console.log(squareIt(myInput)) // 6056521

Pure(?) function - same input, different outputs 👍

Kind of a 'trick' - I know - but the input is identical each time. Because of this, in the strictest sense, it can be considered that functions such as these are not pure - as there are possible inputs that will wreck the purity.

Ankit Kumar • May 26 '23


const squareIt = (number) => {
    return number * number;
}
const myInput = { valueOf() { return performance.now() }}

console.log(performance.now()) // 132161.5
console.log(squareIt(myInput)) // 17466767811.611576
console.log(performance.now()) // 132162
console.log(squareIt(myInput)) // 17466847108.83685

JS is fun, since input is changing its value on each call, hence output is different

Jon Randy 🎖️ • May 26 '23 • Edited

But the input to the function is the same. The calculation differs because of coercion that happens as a feature if JS. The inputs themselves are unchanged. The input in this case is an object with a single method.

Ankit Kumar • May 26 '23

In input of function is function that keeps changes its value, then that function can not be considered as pure function, right ?

Jon Randy 🎖️ • May 26 '23 • Edited

The input is an object, but it's value upon coercion to a number differs on each coercion. In a very strict sense, such a simple function could be considered impure. To make it strictly pure in JS, you could add a bunch of code checking types etc.

Jack • May 27 '23

Put simply, the input itself is impure. The valueOf getter uses performance.now which is external state (calling valueOf with the same inputs does not return the same result every time). When you introduce impure inputs then you’ve already broken the fp paradigm.