Quick JS: Arrow Functions

Oct 11, 2018 · 125 words · 1 minute read es6 js es7

Arrow functions are just a shorter syntax for writing your functions. The biggest difference is that the arrow function does not have its own this keyword available inside that function. If you are not sure what it is, you can read about it on MDN.

A simple example to get you started with writing arrow functions is a simple click event:

document.querySelector(.close).addEventListener(click, () => 
//action here 
});

Instead of writing something like this.

document.querySelector(.close).addEventListener("click"function() {
    //action here 
});

I think arrow functions can help you keep your code more streamlined but I still like writing out functions in the long way. I find it to be more readable for me. For some more information on Arrow Functions check out these resources.