Почему не удаляется слушатель?

Question

[Анастасия Егорова]

<style>
	.container {
		width: 100px;
		height: 100px;
		background-color: red;
	}
</style>
<div class="container"></div>
<script>
	const start = () => {
  console.log('start');
  document.addEventListener('mousemove', () => action('action'));
  document.addEventListener('mouseup', end);
}
const action = (log) => {
  console.log(log);
}
const end = () => {
  console.log('end');
  document.removeEventListener('mousemove', action);
  document.removeEventListener('mouseup', end);
}
document.querySelector('.container').addEventListener('mousedown', start);
</script>

Answer 1

[Александр]

- document.addEventListener('mousemove', () => action('action'));
+ document.addEventListener('mousemove', action);

Comments

[Анастасия Егорова]

Александр так мне нужно, как-то передавать аргументы

[alex4answ]

Анастасия Егорова, ну дак у вас тогда 2 разные функции получаются, а для удаления нужна ссылка на ту функцию, что передали в addEventListener

[Анастасия Егорова]

alex4answ, точняк, совсем забыла про ссылки))

[alvvi]

Анастасия Егорова, так передавайте внутри другой функции

function handleMouseMove (e) {
  action('action');
}
document.addEventListener('mousemove', handleMouseMove);

[Анастасия Егорова]

Илья Ростопка, спасибо)

[Анастасия Егорова]

Илья Ростопка, а если берется аргумент из параметра функции? Как здесь быть?

const start = (str) => {
  document.addEventListener('mousemove', () => action(str));
}

[Анастасия Егорова]

alex4answ, понимаю, что в этом проблема, но чего-то не могу додуматься как исправить. Надо где-то сохранить функцию получается, а я не знаю как потом ей передать аргумент

[alex4answ]

Анастасия Егорова, значит сохраните функцию куда-нибудь

[Анастасия Егорова]

alex4answ, помоги пожалуйста. Не получается у меня

[alex4answ]

Анастасия Егорова, что-то типа:

let actions = {};

const start = (str) => {
  actions[str] = () => action(str);
  document.addEventListener('mousemove', actions[str]);
}

const end = (str) => {
  if (typeof actions[str] === 'function') {
    document.removeEventListener('mousemove', actions[str]);
  }
}

[Анастасия Егорова]

alex4answ, спасибо огромное, работает. Это сверх моих знаний было)