Javascript Создание, вызов и запуск пользовательских обратных вызовов

Question

Я создаю свой собственный класс / библиотеку / SDK, используя webpack и узел.

Он в основном берет изображение и передает его в API, а затем выполняет некоторые другие трудоемкие функции, которые не имеют значения.

Но поскольку эта submit() функция является асинхронной, я хочу добавить функцию обратного вызова, чтобы пользователь знал, когда и когда она была завершена или допущена ошибка.

Ниже приведено описание того, как пользователь видит его инициализацию, а также прослушивает обратный вызов onSuccess или onError.

Клиентский Javascript

<button onclick="hsp.submit()" type="button">Submit</button>

-

<script type="text/javascript">
    const hsp = new HSP("123");

    hsp.onSuccess(function (response) {
        console.log(response);
    });

    hsp.onError(function (error) {
        console.log(error);
    });

</script>

библиотека

var HSFileReader = require('./helper/filereader');
var api = require('./api');

    class HSP {

        constructor(product) {

    }
        async submit() {

            try {

           //action 1 
           //action 2
           //action 3
           // if it reaches the end it has completed call success


            } catch (e) {
                throw "Error(submit): Failed to submit" + e;
            }
        }

        onSuccess(response) {

        }

        onError(errors) {

        }

    }

    module.exports = HSP;

Итак, в этой функции async submit () я делаю 3 действия (например, вызов внешнего API). Если все действия завершены, я хочу вызвать этот обратный вызов onSuccess, чтобы клиент знал, что он завершен, и получил ответ. Если какие-либо ошибки происходят аналогичным образом, я хочу вызвать обратный вызов onError?

Итак, мой вопрос состоит в том, что вышеизложенное является подходящим способом обработки этого, как мне вызвать эти обратные вызовы в моей функции отправки?

Answer 1

EDIT

попробуйте это

var api = require('./api');

class HSP {

    constructor(product) { }

    async submit() {
        try {
       //action 1 
       //action 2
       //action 3
       // if it reaches the end it has completed call success
       return someValue;

        } catch (e) {
            throw "Error(submit): Failed to submit" + e;
        }
    }

}

module.exports = HSP; 

на инициале

<script type="text/javascript">

    const hsp = new HSP("123");

    const submitOnClick = async () => {
         try {
             const response = await hsp.submit();
             // handle the response
         } catch(e) {
            // handle the errors
         }

    }

</script>

и

<button onclick="submitOnClick()" type="button">Submit</button>