Functions are objects in JavaScript, let's prove it!

Functions are objects in JavaScript, let's prove it!

A function in JavaScript is an object, because,

  1. Functions contain properties like objects
  2. We can add new properties or read the properties
  3. We can pass a function to another function along with its properties and data
  4. We can return a function along with its properties and data
  5. It belongs to the JavaScript prototype chain

Talk is cheap, show me your code

Let's see these statements in action,

Functions contain property

We can get a function name just like object properties,

function getBestRockBandInBd() {
  return 'Warfaze'; 
}

console.log(getBestRockBandInBd.name); // getBestRockBandInBd

Here we see, when we create a function, it has the property of name that can be printed just like object properties.

When we create a function, it internally creates an object with the following properties,

  • Code (We can invoke them using functionName())
  • name (Stored the function name, not applicable for the arrow functions)

We can add new properties or read the properties

We can use the function to store property and retrieve it later,

function bestPsychedelicRockBandInBd() {
  return 'Sonar Bangla Circus';
}

bestPsychedelicRockBand.foo = 'bar';

console.log(bestPsychedelicRockBand.foo); // bar

Here we set a property foo to the function bestPsychedelicRockBand and later print it in the console.

We can pass a function to another function along with its properties and data

Let's pass a function to another function and do the execution,

function nemesis(whoIsVocal) {
  console.log(whoIsVocal()); // `whoIsVocal` function comes as parameter
}

// We will pass this function to `nemesis` function as parameter
function showVocalName() {
  console.log('Zohad');
}

nemesis(showVocalName);

We can return a function along with its properties and data

Now like an object, we will return a function from another function,

function anotherRockBand() {
  // We are returning function named `aurthohin`
  return function aurthohin() {
    console.log('This is Aurthohin');
  }
}

const returnedFunction = anotherRockBand();

returnedFunction();

This feature power up the JavaScript closure feature.

It belongs to the JavaScript prototype chain

We know the base object Object has a property called prototype,

console.log(Object.hasOwnProperty('prototype')); // true

If we create a function, we can see, the function also has the property prototype,

function crypticFate() {}

console.log(crypticFate.hasOwnProperty('prototype')); // true

We can invoke a function using call, bind and apply. Interestingly these are not function's own property, we can verify this,

function crypticFate() {}

console.log(crypticFate.hasOwnProperty('call'));  // false
console.log(crypticFate.hasOwnProperty('bind'));  // false
console.log(crypticFate.hasOwnProperty('apply'));  // false

Actually, these properties are inherited from the prototype chain and native to the base object. To verify,

function crypticFate() {}

console.log(crypticFate.__proto__.hasOwnProperty('call'));  // true
console.log(crypticFate.__proto__.hasOwnProperty('bind'));  // true
console.log(crypticFate.__proto__.hasOwnProperty('apply'));  // true

Final thoughts

As we see these 5 points, mentioned above, functions are just objects in JavaScript world. Let me know your thoughts on this.