Как использовать Promises с событиями «click», не добавляя обработчик событий в функцию executor?

Question

РЕДАКТИРОВАТЬ: попытался уточнить вопрос и сократить его - я вставил какой-то код, чтобы показать, что я пытался решить эту проблему, но я думаю, что это только запутало вещи.

Я новичок в Promise и пытаюсь преобразовать существующий код (что довольно просто) в работу с обещаниями.

Я бы хотел связать нажатие кнопки с другими частями моей программы с помощью обещаний, то есть я бы хотел трактовать щелчок как асинхронное событие (например, как ajax-вызов). Как это сделать?

Из документации MDN обещание в основном работает следующим образом

function myAsyncFunction(url) {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    xhr.open("GET", url);
    xhr.onload = () => resolve(xhr.responseText);
    xhr.onerror = () => reject(xhr.statusText);
    xhr.send();
  });
}

и я это прекрасно понимаю. Насколько я понимаю, будет работать следующее

function myPromiseGenerator() {
  return new Promise((resolve, reject) => {
   this.myButton.addEventListener('click',function(e) {
    /// do something to process the answer
    resolve(something);
    }
  });
}

но тогда как мне удалить прослушиватель событий? Я хотел бы добавить прослушиватель событий только один раз, а не при каждом вызове myPromiseGenerator, но я не могу понять, как заставить его работать.

В общем, как лучше всего делать то, что я пытаюсь сделать? Спасибо за любую помощь.

Answer 1

Просто используйте опцию once прослушивателя событий:

function myPromiseGenerator() {
  return new Promise((resolve, reject) => {
    this.myButton.addEventListener('click',function(e) {
        /// do something to process the answer
        resolve(something);
    }, {once: true});
  });
}