Yes, more important than hoisting, closures, and scope

Daniel Jung

Follow

Oct 21, 2019 · 3 min read

The most important feature of JavaScript is that functions are objects.

That’s it. Understanding this will open up a whole new understanding of the JavaScript language. In JavaScript, functions are objects. And in JavaScript, objects have properties consisting of key-value pairs. As follows, JavaScript functions have properties that consist of key-value pairs.

Just like arrays (also JavaScript objects) have a prototype property to which unique methods can be attached (e.g., Array.prototype.filter()), functions, too, have a prototype property. Among the properties of Function.prototype are the unique properties that give the function code that can be invoked (i.e., the meat and potatoes of your function). But the runnable code isn’t the only property of a function.

You may have come across the .apply, .bind, and .call methods. These methods, as you would expect, are methods on the Function.prototype property. Function.prototype also has its own properties such as .name, which contains the name of the function, and .length, which contains the number of arguments expected by the function.

Why Is This Important and How Is It Used?

You might have heard JavaScript described as a functional language. This means that in JavaScript programs are built through functions.

Functions are considered first-class, meaning functions can do just about anything — be passed in as arguments to other functions, be inserted into data structures, be assigned to variables, and be returned by other functions.

Here are some examples that illustrate that JavaScript functions really are just objects

Say we assign a function to a variable called myFunction:

var myFunction = function (str) { console.log(str) }

We can access the name property of the function as we would access a property in any object:

myFunction[“name”]
myFunction.name// both return “myFunction”

Likewise, we can access the length property of the function, which returns the number of arguments the function takes:

myFunction[“length”]
myFunction.length// both return 1
// because myFunction takes in one argument, str

We can also assign new properties to a function — just the way you would assign properties to any other JavaScript object:

myFunction.myNewProperty = "hello"myFunction.myNewProperty
// returns "hello"

And because functions are first-class citizens in JavaScript, we can do just about anything with them — including assigning other functions as the properties of functions.

var coolFunc = function() { return 1 }myFunction.coolProperty = coolFuncmyFunction.coolProperty
// returns function() { return 1 }myFunction.coolProperty()
// returns 1

Although you may never want to assign a function as a property of another function in practice, this simple example illustrates this concept.

Functions are just JavaScript objects, and, as follows, anything you can do with an object in JavaScript, you can do with a function.

The only real difference with functions is that they, along with other objects in JavaScript, have their own own unique methods and properties, one of which is a method that holds the executable code in the function and another that invokes that executable code.

Conclusion

So go ahead and give it a try.

Play around with objects the same way you would with a simple {key: “value”} written object.

You’ll be surprised at what you can do and, in turn, will gain familiarity with the powerful uses looking at functions in this way can create.