4.

const fun = (값) => () => {
  console.log('고차 함수입니다.', 값);
}
const fun1 = fun(1);
태그.addEventListener('click', fun1);
태그.removeEventListener('click', fun1);

해설 가장 흔한 오답은 다음과 같습니다.

태그.removeEventListener('click', fun(1));

removeEventListener()를 설명하면서 addEventListener()에 넣은 함수와 === 연산자로 연산할 때 결과가 true가 되어야 한다고 했습니다. 하지만 연산해 보면 항상 false가 나옵니다.

fun(1) === fun(1); // false

고차 함수인 fun()은 항상 새로운 함수를 반환하기 때문입니다. 같은 함수가 아니므로 이벤트가 제거되지 않습니다. 따라서 이벤트를 제거하고 싶다면 fun(1)을 fun1 변수에 저장해서 같은 함수라는 것을 보장해야 합니다.

본문으로