Step Up Your JS: A Comprehensive Guide to Intermediate JavaScript/

...

/

Arrow Functions () => {}

Arrow Functions () => {}

Learn an entirely new type of function. Learn arrow functions and how they allow us to write cleaner callbacks and functions in general. Learn how we can leverage their new rules of 'this' binding to make our code more intuitive and clean.

We'll cover the following...

We now have a new way to write a function. The following two functions are equivalent.

Press + to interact
const standardFnAdd = function(num1, num2) {
    console.log(num1 + num2);
    return num1 + num2;
}
const arrowFnAdd = (num1, num2) => {
    console.log(num1 + num2);
    return(num1 + num2);
};
standardFnAdd(2, 5); // -> 7
arrowFnAdd(2, 5); // -> 7

These new functions are called arrow functions. Let’s break down what’s happening so far. We can omit the function keyword. Between the parameter brackets and the function body brackets, we need to add =>.

This shorthand decreases the number of characters we need to write, but there’s more to it than just that.

Note also that arrow functions can only be ...