В предыдущем блоге мы говорили о том, как создавать собственный код в Visual Builder. В этом блоге мы обсудим, как работать с обратными вызовами в этом пользовательском коде.
Если вы знакомы с обратными вызовами Javascript, читайте дальше, но если вам нужно введение в обратные вызовы и асинхронные операции и почему это требует особого внимания, вот хороший учебник. Короче говоря, нам нужно управлять этим специально, потому что результат возврата пользовательской функции может быть еще недоступен, когда он назначается в рамках обратного вызова. Поскольку обратный вызов планируется запустить позже (асинхронно), ваш результат может быть возвращен неопределенным, поскольку обратный вызов, который заполняет это возвращаемое значение, еще не завершен.
Давайте рассмотрим конкретный пример получения местоположения GPS с помощью API HTLM5 navigator.geolocation.
Скриншот из: https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition
Как показано выше, функция принимает три параметра: успех, ошибка и параметры. Успех и ошибка являются обратными вызовами и используются в этом API, поскольку получение местоположения может занять несколько секунд. Если бы функция ждала результата, ваше приложение тоже застряло бы в ожидании. Таким образом, обратные вызовы используются для «обратного вызова», когда эта информация доступна, а не для блокировки выполнения вашего кода. Но тогда как вы справляетесь с описанной выше ситуацией, когда наш обратный вызов успеха может еще не быть вызван? Используйте обещание, как обсуждалось в учебнике для начинающих, на который я ссылался в начале статьи.
Давайте реализуем это в пользовательском коде Visual Builder, используя функцию модуля.
PageModule.prototype.getGeolocation = function() { return new Promise(function(resolve, reject) { var geolocation = navigator.geolocation; geolocation.getCurrentPosition(function(position) { var latitude = position.coords.latitude; var longitude = position.coords.longitude; var latlong = JSON.stringify({ lat: latitude, lng: longitude}); console.log(latlong.toString()); resolve(latlong); }, function(error) { console.log(error); reject("The error is: " + error); }); });
}
В нашей пользовательской функции getGeolocation мы возвращаем Promise. Это обещание заключает в себе наш вызов navigator.geolocation и две функции обратного вызова, которые он ожидает как анонимные методы. Это гарантирует, что вызов пользовательской функции нашей цепочки действий будет ожидать возврата обещания (сам по себе асинхронный вызов), но в то же время освобождает пользовательскую функцию от блокировки выполнения. Успешное получение геолокации вызывает нашу анонимную функцию для успешного выполнения и возвращает нашу назначенную переменную в функции разрешения обещания, гарантируя, что она не является неопределенной. Неуспех вызывает функцию ошибки как анонимную функцию, а затем вызывает функцию отклонения обещания.
Использование приведенного выше шаблона в функциях пользовательских модулей Visual Builder обеспечит:
- Visual Builder может ссылаться на ваш пользовательский код в цепочке действий.
- Ваши обратные вызовы будут завершены до того, как будет возвращен результат, гарантируя, что возвращаемый результат не является неопределенным.
- Позволяет вам также иметь дело с условиями ошибки в той же функции
Первоначально опубликовано на blogs.oracle.com 25 мая 2018 г.
