Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialAna Weller
9,310 PointsWhat is the => operator used for in the 'Javascript and the DOM' / 'Styling Elements' tutorial?
I can't find any documentation on the use of the => operator used in Guil Hernandez's Javascript and the DOM / Styling Elements
Could someone please tell me what it means in the context of the following code?
const button = document.querySelector('button.description');
button.addEventListener('click', () => { p.innerHTML = input.value + ':'; });
Thanks!!
2 Answers
andren
28,558 PointsIt's called an arrow function, it is an ES2015 feature, Treehouse actually has a workshop dedicated to it that you can find here.
But the simplified and short explanation is that it's a new and different way of creating functions.
() => { p.innerHTML = input.value + ':'; }
Is equivalent to
function () { p.innerHTML = input.value + ':'; }
Which is syntax you are probably more familiar with. There are some differences between the traditional function syntax and arrow functions beyond just the obvious difference of how their declaration looks. So I'd recommend you take a look at the workshop, it's pretty short but goes over some of the new features.
And if you want more detailed documentation then the Mozilla Developer documentation I linked to above should provide you with plenty of technical info.
Ana Weller
9,310 PointsGreat, thanks very much for the explanation and links! Really useful...