JavaScript Quickstart

Hi I am Jomar M. Berdejo, I am here to assist you in your web development journey, I'm glad that you're here, spending your time learning with me.

JavaScript Functions

Functions in JavaScript are blocks of code that perform a specific task or calculate a value. They are reusable and can be invoked (called) multiple times throughout a program. Functions allow you to organize code, encapsulate logic, and make your code more modular and maintainable.

Regular Functions

Regular function is a type of function declaration that is defined with the function keyword followed by the function name, a list of parameters enclosed in parentheses, and the function body enclosed in curly braces. It is one of the fundamental ways to define reusable blocks of code in JavaScript.

Here is an example syntax for regular function in JavaScript.

function functionName(parameter1, parameter2, ...) {
  // Function body
  // Code to be executed
  // Return statement (optional)
}

Here is an example on how regular functions works in JavaScript

function sayHello(name) {
  alert("Hello, " + name + "!");
}

sayHello("John"); // Output: Hello, John!

In the above example, `sayHello` is a function that takes a parameter `name` and alert a greeting. To invoke (call) the function, you simply use its name followed by parentheses and provide any necessary arguments:
sayHello("John"); // Output: Hello, John!

Arrow Functions

In addition to regular functions, JavaScript also introduced arrow functions (also known as fat arrow functions) as a more concise syntax for writing functions. Arrow functions have become popular in modern JavaScript due to their shorter syntax and lexical `this` binding.

Here's an example of an arrow function in JavaScript

const add = (a, b) => {
  return a + b;
  }
          

The above arrow function `add` takes two parameters `a` and `b` and returns their sum.

Arrow functions can also have implicit return statements when the function body consists of a single expression. In such cases, you can omit the curly braces and the `return` keyword:

const multiply = (a, b) => a * b;
alert(multiply(2, 3)); // Output: 6

Conclusion

Arrow functions have a more concise syntax and inherit the `this` value from the surrounding context, which can be useful in certain scenarios.

It's important to note that arrow functions have some differences in behavior compared to regular functions, particularly with regard to `this` binding and the `arguments` object. Therefore, understanding the advantages and use cases of both regular functions and arrow functions is essential for writing effective JavaScript code.

Now challenge yourself, click the link below to practice!