0

so i have been programming JS for a while now , and basically i never really understood one thing , I.E. the e in events , have a look at the code below :

have a look at the HTML code : 

    <a href="https://developer.mozilla.org/en-US/docs/Web/Events/keydown">Hello</a>

Jquery code : 

$(function () {

    $('a').click(function(e){
        console.log(e.target)
    })

});

now what is e in the above code , i understand the following :

e is an object normalized by jquery and is being internally passed

also i have come across the following explanation :

The functions you are referring to are called callback functions. Parameters for those are passed from within the function that is calling them ( in your case .on() or .click() )

to better illustrate how callback functions work here is an example

function customFunction ( param1, callback ) {
    var response = "default response";
    if (param1 === "hello") {
        response = "greeting";
    }
    callback(response);
}

customFunction("hello", function(e) {
    console.log("this is " + e);
}); // > this is greetings

I have read a famious thread on SO here. , but it only answers what e is and not where it comes from .

BUT I still don't understand where that e is coming from . can somebody explain in a bit of detail ?

Thanks .

Alex-z

Community
  • 1
  • 1
Alexander Solonik
  • 9,838
  • 18
  • 76
  • 174
  • 1
    Where you are invoking the function `callback(response);` you are passing the argument thats `e` in `function(e) { console.log("this is " + e); }` – Satpal May 27 '15 at 11:26
  • if you pass `f` into the function i.e. `function(f)` , the variable will become `f` instead of `e`. `e` has no significance. It's just a variable name, and a short name for `event`. – Gogol May 27 '15 at 11:30
  • it is an event `object` – Amit Soni May 27 '15 at 11:31
  • 1
    @guys ! ur just repeating what i have already read .. i am asking a deeper question ;) – Alexander Solonik May 27 '15 at 11:43

1 Answers1

0

When using jQuery the e parameter (which you can rename to anything you like) is going to be an Event object passed to your event handler method by jQuery. The Event object is jQuery's wrapper type for browser event interfaces so that you can have a standard interface in your handlers see here - jQuery.

That type has a property called 'target' which points to the original native browser event interface that jQuery was given by the browser. For example for mouse clicks the native interface would be this for example. Note actual interface may differ across browser implementations particularly older ones which is why jQuery attempts to provide some consistency via their type.

diadical
  • 197
  • 4
  • is't that already explained in the links i have given above , i am asking where is e passed from ? – Alexander Solonik May 27 '15 at 11:47
  • From the jQuery code that calls your event handler when the event is triggered, in your first example that would be the click event. When you do $('...').click() you are telling jQuery to handle the DOM click event and when it is triggered call your function... so it creates the Event object as I've explained and calls your function with that as an argument. – diadical May 27 '15 at 12:21
  • If you're interested in terms of the jQuery code then have a look [here](https://github.com/jquery/jquery/blob/master/src/event.js#L225) - this is where events get triggered to and jQuery creates the Event (e) object. After that it goes through dispatch which determines which handlers are defined and calls them passing in the created object. – diadical May 27 '15 at 12:32