javascript - 이벤트 핸들러를 위해 무슨 일이 벌어지고 있습니까? 다른 기능에도 적용됩니까?

자바 스크립트의 모든 함수는 함수가 아무 것도 수행하지 않더라도 임의로 많은 수의 매개 변수를 전달할 수 있습니다. 예를 들어 쓸모없는 경우 다음이 합법적입니다.

function thingThatExpectsZeroParams() {
  console.log('hello');
}
thingThatExpectsZeroParams(1, 2, 3, 4, [5], 'six');

6 개의 데이터 조각이 함수에 전달되었지만 함수가 아무 것도 수행하지 않았기 때문에 아무 작업도 수행되지 않았습니다. 전달 된 값에 액세스하려면 호출 할 이름을 선택하면됩니다. 이 이름은 함수의 로컬 이름이며 원하는 이름이 될 수 있습니다.

function callback(event) {
  console.log(event);
}
// I could also just have easily called it something else, and the code would work just as well
// function callback(quesoBurrito) {
//   console.log(quesoBurrito);
// }
callback('hello');

따라서 다음과 같이 리스너를 설정할 때 :

onChange={() => this.setField()}

이벤트 객체를 전달하여 함수가 호출됩니다. 그러나 함수가 첫 번째 매개 변수에 이름을 지정하지 않으므로 액세스 할 수있는 방법이 없으며 this.setField를 호출하면 아무것도 전달하지 않습니다.

이 리스너와 대조적으로 :

onChange={(e) => this.setField(e)}

이벤트 객체를 전달하여 함수가 다시 호출됩니다. 이번에는 해당 인수의 이름을 'e'로 지정한 다음 원하는대로 수행 할 수 있습니다 (이 경우 setField로 전달).

이 작업을 수행 할 때 :

onChange={this.setField}

중개인을 잘라 버렸습니다. this.setField는 이벤트 객체를 전달하여 직접 호출됩니다. 아마도 setField는 이것을 예상하고 전달 된 객체로 무언가를 수행합니다.

복잡하지 않습니다. onChange에 할당 한 Javascript 함수는 적절한 시간에 호출되며 일반적으로 e 라는 단일 인수를 전달합니다. . 해당 인수에 함수에서 원하는 이름을 지정하거나 전혀 선언하지 않을 수 있지만 첫 번째 인수가 있습니다.

이렇게하면 :

onChange={() => this.setField()}

이벤트 핸들러로 전달 된 인수를 무시하고 이벤트 핸들러 내에서 this.setField() 를 호출합니다.  놀랍게도 setField() 에 대한 논쟁을 전달하지 않습니다. . 실제로 실제로 일어나는 일은 다음과 같습니다.

onChange={(e) => this.setField()}

와이즈 비즈

DOM 사양에 따르면 onChange 이벤트 핸들러가 호출되면

How does it know to associate the event to e? does this functionality extent to other things when dealing with html?

가 전달됩니다.  객체를 첫 번째 인수로 선언하십시오 (선언하든 아니든 함수에 대한 첫 번째 인수가 있습니다). 이것은 자바 스크립트에서 콜백이 작동하는 방식입니다. 콜백의 발신자는 콜백을 전달할 인수를 결정합니다. 인수를 선언하고 사용하는지 여부에 관계없이 콜백을 선언하는 것은 귀하에게 달려 있습니다. 신고 방법에 관계없이 발신자가 전달합니다.

이 코드 섹션 :

e

onChange 이벤트 핸들러가 되고자하는 함수는 onChange={this.setField} 입니다.  방법. 따라서 DOM이 해당 메소드를 호출 할 때 위 예제와 같이 이벤트 객체를 첫 번째 인수로 전달합니다.

와이즈 비즈

앞에서 설명한 것처럼 DOM 사양은이 이벤트 핸들러가 지정되는 곳입니다. 그것의 정의에서, 당신이이 이벤트 핸들러로 등록한 콜백 함수로 전달 될 인수가 무엇인지 설명합니다. 이것은 Javascript의 모든 콜백에 적용됩니다. 발신자는 콜백에 전달할 대상을 결정합니다. 이것은이 유형의 이벤트 핸들러에만 국한되지 않습니다. 콜백은 Javascript에서 많은 곳에서 사용됩니다. setField() 와 같은 것조차  콜백을 가져오고 콜백에 전달할 인수를 결정하는 콜백 (이 경우 Array 객체의 구현)의 호출자입니다.

This one I really dont understand why it works, but it does. I am assuming that it inherently know to pass the event as default to the function. again does this inbuilt logic occur anywhere else, maybe not neccessarily for events?