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 trial

JavaScript jQuery Basics (2014) Creating a Simple Drawing Application Perform: Part 5

What does the function(e) do?

I am taking this course and I have accomplished the task in this video. I am just a bit curious about what the 'e' variable does. For example:

$canvas.mousedown(function (e) { lastEvent = e; mouseDown = true;

...it appears to me that the e value represents the mouse's current location. Is that true?

4 Answers

e is short for event and can capture the event. So in this case its specifically its capturing the mousedown and only running it when the mouse is pressed down vs. up or in another direction.

Rifqi Fahmi
Rifqi Fahmi
23,164 Points

ooooo i see because this is the anonymous function, its different with normal function such as :

function exFunct(e){
 //doing something here such as
 echo e;
}

with

$('canvas').mousedown(function(e){
lastEvent = e;
})

The 'e' inside that function is different meaning right? the first function e is argument, but the second anon function e is event. Am I right ?? :D

You are almost correct. You are correct in regards to the exFunct(e). The e in this case IS an argument and is NOT the event. However, the e in the function inside the mousedown has nothing to do with it being anonymous. You can even call exFunct to run on mousedown. but the difference is that methods like mousedown(), mouseup(), click(), hover(), etc...are events and by default carry the event as the first argument.

Example

So by default, the argument on event methods, whatever you choose to name it, will always be the event.

I hope this helps.

Rifqi Fahmi
Rifqi Fahmi
23,164 Points

what if I change the code to this

$('canvas').mousedown(function(argument){
     lasEvent = argument;
})

are this still going to work ?

Yes. This will still work. The e can be named anything. It will still be the event itself. so you would still have access to all of the properties of the event such as type, target, preventDefault and many others. Demo Here

without having done the course. e on events are often the event itself.

so in this case, from the looks of it, e = the mousedown event.

klick
klick
2,170 Points

So is ā€œeā€ reserved and will always represent the (genuine) nature of the method?

No it is not a reserved keyword but you will commonly see e or event used in real world applications.