Advanced JavaScript Series - Part 7: First Class Citizens & Higher Order Functions

First Class Citizens

First-class citizenship simply means being able to do what everyone else can do. In JavaScript, functions are objects (hence the designation of first-class object).

• JavaScript has all those abilities or features that are required to be a language having First Class Functions, hence functions are treated as First Class Citizens.

• Let’s look at all the abilities of functions being a First Class Citizen.

1. Ability to treat functions as values-

Code-

var hello = function(){
  return "hello world"
}

console.log(hello())

Output-

"hello world"

2. Ability to Pass functions as arguments-

Code-

function hello(fn){
  fn()
}

hello(function() { console.log("hello world") })

Output-

"hello world"

3. Ability return a function from another function-

Code-

function hello(){
  return function() {
    return "hello world"
  }
}

var hi=hello()
console.log(hi())

Output-

"hello world"

• Because this behavior of JS functions as first class citizens, we are also able to do functional programming that we will learn more about in further parts of our series.

Higher Order Functions-

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

Simplified Example-

Code-

const multiplyBy = (num1) => {
  return function (num2) {
    return num1 * num2;
  }
}

const multiplyByTwo = multiplyBy(2);
multiplyByTwo(4)

Output-

8

---

Connect with me-

• GitHub
• LinkedIn

---

Appendix-

1. Advanced JavaScript Series - Part 1: Behind the scenes (JavaScript Engine, ATS, Hidden Classes, Garbage Collection)
2. Advanced JavaScript Series - Part 2: Execution Context and Call Stack
3. Advanced JavaScript Series - Part 3: Weird JS behavior, Strict Mode and Hoisting, Temporal Dead Zone
4. Advanced JavaScript Series - Part 4.1: Global, Function and Block Scope, Lexical vs Dynamic Scoping
5. Advanced JavaScript Series - Part 4.2: Scope Chains and their working, Lexical and Variable Environments
6. Advanced JavaScript Series - Part 5: IIFE & 'this' keyword in JS(tricky Eg.), call(), apply(), bind(), Currying(Functional Prog)
7. Advanced JavaScript Series - Part 6.1: Everything in JS is an Object? Weird JS behaviors revealed, Primitive Non-Primitive Types
8. Advanced JavaScript Series - Part 6.2: Pass by Value & Pass by Reference, Shallow & Deep Copy, Type Coercion
9. Advanced JavaScript Series - Part 7: First Class Citizens & Higher Order Functions
10. Advanced JavaScript Series - Part 8: The 2 Pillars~ Closures & Prototypal Inheritance
11. Advanced JavaScript Series - Part 9: Constructor Functions, Object Oriented, new keyword

---

References-

1. https://www.developintelligence.com/blog/2016/10/javascript-functions-as-first-class-objects/
2. https://www.geeksforgeeks.org/what-is-first-class-citizen-in-javascript/
3. https://medium.com/javascript-scene/higher-order-functions-composing-software-5365cf2cbe99

Comments

[MaryMartinz]

I have been waited for this for so long and finally got it and also all your posts are proved to be very helpful for me. thanks spells to break up a couple

[Pranav]

Thank you for following along with the series and I am glad the series was able to provide some value to you🙂

[cronlabspl]

Very informative :)

I especially like example 3. return statement returns another function. Maybe usefull.

[Pranav]

Thank you 😃

I am glad I was able to provide some value!