JavaScript: Function Types You Should Know!

Heyy, how are you?!

Have you ever had to deal with some JavaScript functions just… they weren’t exactly the way you expected? Maybe it looked like the functions were written in a different way than what you’ve seen and I don’t mean “logically” speaking… 😅

If yes, I would like to introduce you to some possibilities of types of functions that we can find!

So, let’s start it and see some basic types!

🎯 Named Function (Traditional way):

The traditional way of creating a function and it’s a set of statements that performs a task or calculates a value!

function sayHello() {
  console.log('Hey everyone!');
}

sayHello();

// Output
'Hey everyone!'

🎯 Arrow Function:

Arrow Functions are simpler, are always unnamed and compact than traditional function expression!

const sayHello = () => console.log('Hey everyone!');

sayHello();

// Output
'Hey everyone!'

🎯 Anonymous Function:

Anonymous Functions don’t have a name specified after the function declaration, so we declare it with a variável to call this function at a some point!

const sayHello = function () {
  console.log('Hey everyone!');
}

sayHello();

// Output
'Hey everyone!'

🎯 Higher Order Function:

Higher Order Functions in a nutshell words is a function that can take one or more functions as arguments or return a function as output. Some of Higher order types is like: reduce, filter, map and others.

// A simple function to print a console.log
function sayHello(){
  console.log('Hey everyone!');
}

// Higher Order Function Example:
function higherOrderFnExample(functionToExecute){

  console.log('I can do anything!');

  functionToExecute()
}

higherOrderFnExample(sayHello);

🎯 Constructor Function:

It’s is used to create Function objects and we need to use the new keyword to create a new Function instance!

// Creating the Constructor Function
function Car () {
  this.name = 'Ford',
  this.color = 'Black'
}

// Creating the Object
const myCar = new Car();

console.log(myCar.name);
// Output
'Ford'

console.log(myCar.color);
// Output
'Black'

Hope this makes you feel a bit more comfortable with functions and their possibilities!

Feel free to reach out to me if you have any questions!

and obviously I hope you enjoyed it 🤟💪🤟💪