[javascript] Javascript / jQuery에서 (e)는 무엇을 의미합니까?

저는 JavaScript / jQuery를 처음 접했고 함수를 만드는 방법을 배우고 있습니다. 많은 기능이 괄호 안에 (e)로 표시됩니다. 제가 의미하는 바를 보여 드리겠습니다.

$(this).click(function(e) {
    // does something
});

함수는 항상 (e)의 값을 사용하지 않는 것처럼 보이지만 왜 그렇게 자주 사용됩니까?



답변

eevent이벤트 핸들러에 전달 될 객체에 대한 짧은 var 참조입니다 .

이벤트 개체에는 기본적으로 이벤트 처리기에서 사용할 수있는 흥미로운 메서드와 속성이 많이 있습니다.

게시 한 예제에서 MouseEvent

$(<element selector>).click(function(e) {
    // does something
    alert(e.type); //will return you click
}

데모 -마우스 이벤트 데모 사용e.whiche.type

유용한 참고 자료 :

http://api.jquery.com/category/events/

http://www.quirksmode.org/js/events_properties.html

http://www.javascriptkit.com/jsref/event.shtml

http://www.quirksmode.org/dom/events/index.html

http://www.w3.org/TR/DOM-Level-3-Events/#event-types-list


답변

면책 조항 : 이것은이 특정 게시물에 대한 매우 늦은 답변이지만이 질문에 대한 다양한 답변을 읽었으므로 대부분의 답변이 숙련 된 코더 만 이해할 수있는 용어를 사용한다는 사실에 놀랐습니다. 이 답변은 초심자 청중을 염두에두고 원래 질문을 해결하려는 시도입니다.

소개

작은 ‘ (e) ‘는 사실 자바 스크립트에서 이벤트 처리 함수라고하는 더 넓은 범위의 일부입니다. 모든 이벤트 처리 함수는 이벤트 객체를받습니다. 이 논의의 목적을 위해, 객체는 다른 언어의 객체와 매우 유사한 속성 ( 변수 ) 및 메서드 ( 함수 ) 를 포함하는 “사물”로 생각하십시오 . 작은 (e) 것 안의 ‘ e ‘ 핸들 은 객체와 상호 작용할 수있게 해주는 변수와 같습니다 (그리고 변수 라는 용어를 느슨하게 사용합니다 ).

다음 jQuery 예제를 고려하십시오.

$("#someLink").on("click", function(e){ // My preferred method
    e.preventDefault();
});

$("#someLink").click(function(e){ // Some use this method too
    e.preventDefault();
});

설명

  • “#someLink”는 요소 선택기입니다 (HTML 태그가이를 트리거 함).
  • “클릭”은 이벤트 (선택한 요소를 클릭 할 때)입니다.
  • “function (e)”은 이벤트 처리 함수입니다 (이벤트시 객체가 생성됨).
  • “e”는 개체 처리기입니다 (개체에 액세스 할 수 있음).
  • “preventDefault ()”는 객체가 제공하는 메서드 (함수)입니다.

무슨 일이야?
사용자가 ID가 “#someLink”인 요소(아마도 앵커 태그)를 클릭하면 익명 함수 “function (e)”을 호출하고 결과 객체를 “e” 핸들러에 할당합니다. 이제 해당 핸들러를 가져 와서 해당 메서드 중 하나 인 “e.preventDefault ()”를 호출하면 브라우저가 해당 요소에 대한 기본 작업을 수행하지 못합니다 .

참고 : 핸들은 원하는대로 이름을 지정할 수 있습니다 (예 : ‘ function (billybob) ‘). ‘e’는 ‘이벤트’를 나타내며 이러한 유형의 기능에 대한 표준으로 보입니다.

‘e.preventDefault ()’가 이벤트 핸들러의 가장 일반적인 용도 일 수 있지만 객체 자체에는 이벤트 핸들러를 통해 액세스 할 수있는 많은 속성과 메서드가 포함되어 있습니다.

이 주제에 대한 몇 가지 좋은 정보는 jQuery의 학습 사이트 인 http://learn.jquery.com 에서 찾을 수 있습니다 . jQuery Core이벤트 사용 섹션에 특히주의하십시오 .


답변

e특별한 의미가 없습니다. e매개 변수가 인 경우 함수 매개 변수 이름 으로 사용하는 것은 규칙 일뿐 입니다 event.

그것은 될 수 있습니다

$(this).click(function(loremipsumdolorsitamet) {
    // does something
}

게다가.


답변

이 예제에서는 해당 e함수에 대한 매개 변수 일 뿐이지 만이 event를 통해 전달되는 것은 객체입니다.


답변

e인수는 이벤트 객체의 약자입니다. 예를 들어 기본 작업을 취소하는 앵커에 대한 코드를 만들 수 있습니다. 이렇게하려면 다음과 같이 작성합니다.

$('a').click(function(e) {
    e.preventDefault();
}

즉, <a>태그를 클릭하면 클릭 이벤트의 기본 작업이 차단됩니다.

자주 볼 수 있지만, 인수로 지정 했더라도 함수 내에서 사용해야하는 것은 아닙니다.


답변

jQuery의 e줄임말 event에서 현재 이벤트 객체입니다. 일반적으로 이벤트 함수가 실행되는 매개 변수로 전달됩니다.

데모 : jQuery 이벤트

데모에서 나는 e

$("img").on("click dblclick mouseover mouseout",function(e){
        $("h1").html("Event: " + e.type);
}); 

내가 사용했을 수도 있습니다 event

 $("img").on("click dblclick mouseover mouseout",function(event){
            $("h1").html("Event: " + event.type);
    }); 

같은 것!

프로그래머는 게으르다. 우리는 많은 속기를 사용하고 부분적으로 작업을 줄이며 부분적으로 가독성에 도움이된다. 이를 이해하면 코드 작성의 사고 방식을 이해하는 데 도움이됩니다.


답변

오늘 저는 “e.preventDefault ()에서”e “와 같은 문자를 사용하는 이유는 무엇입니까?”에 대한 게시물을 작성했습니다. 그리고 내 대답이 의미가 있다고 생각합니다 …

먼저 addEventListener 구문을 살펴 보겠습니다.

일반적으로 다음과 같습니다.
target.addEventListener (type, listener [, useCapture]);

그리고 addEventlistener의 매개 변수 정의 는 다음과 같습니다.

type: 청취 할 이벤트 유형을 나타내는 문자열입니다.

listener: 지정된 유형의 이벤트가 발생했을 때 통지를받는 객체 (Event 인터페이스를 구현하는 객체). 이것은 EventListener 인터페이스를 구현하는 객체이거나 JavaScript 함수 여야합니다.

(MDN에서)

하지만 주목해야 할 점이 하나 있다고 생각
합니다. 자바 스크립트 함수를 리스너로 사용하면 Event 인터페이스 (object event)를 구현하는 객체 가 함수 의 “첫 번째 매개 변수” 에 자동으로 할당됩니다. function (e), “e”가 함수의 유일한 매개 변수이기 때문에 객체가 “e”에 할당됩니다 (확실히 첫 번째 매개 변수입니다!), 그런 다음 e.preventDefault를 사용하여 무언가를 방지 할 수 있습니다 ….

아래 예제를 시도해 보겠습니다.

<p>Please click on the checkbox control.</p>
<form>
    <label for="id-checkbox">Checkbox</label>
    <input type="checkbox" id="id-checkbox"/>

    </div>
</form>
<script>
    document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
         //var e=3;
         var v=5;
         var t=e+v;
         console.log(t);
        e.preventDefault();

    }, false);
</script>

결과는 [object MouseEvent] 5가 되며 클릭 이벤트를 방지합니다.

그러나 다음과 같이 주석 기호를 제거하면

<script>
       document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
            var e=3;
            var v=5;
            var t=e+v;
            console.log(t);
            e.preventDefault();

       }, false);
   </script>

당신은 얻을 것이다 : 8오류 : “catch되지 않은 형식 오류 :. e.preventDefault가 HTMLInputElement (69 VM409)에서 함수가 아닙니다.”

확실히 이번에는 클릭 이벤트가 방지되지 않을 것입니다. 함수에서 “e”가 다시 정의 되었기 때문입니다.

그러나 코드를 다음과 같이 변경하면

<script>
       document.querySelector("#id-checkbox").addEventListener("click", function(e,v){
            var e=3;
            var v=5;
            var t=e+v;
            console.log(t);
            event.preventDefault();

       }, false);
   </script>

모든 것이 다시 올바르게 작동합니다 … 8 을 얻고 클릭 이벤트가 방지됩니다

따라서 “e”는 함수의 매개 변수 일 뿐이며 “이벤트 객체”를 수신하고 e.preventDefault ()를 수행하려면 function ()에 “e”가 필요합니다. 이것이 “e”를 js에 의해 예약되지 않은 단어로 변경할 수있는 이유이기도합니다.