There are lots of tutorials about promise in the internet.
Recently I am studying the frontend code of SAP Cloud for Customer and I come across a real example of how promise is used there. Below is the Passcode logon view.
Once Passcode is entered, suppose I have already entered the system url and frontend user name in the past, they will be directly retrieved from browser storage.
Currently I use Chrome to access C4C and Web SQL is used as browser storage, where the system url and logon user name could be found from Chrome development tool.
The corresponding database initialization and table read is done by code below in file AppStatusService.js.
The series of callback functions are chained by promise API “then()” which are expected to be executed sequentially:
(1) _createTable() could only be executed after database initialization is done. (2) _getApplicationStatus could NOT be executed unless the database table which stores Application status is available – this is ensured by _createTable. (3) After application status is read from database table, _createDefaultEntries could be called to render the default value in Passcode logon view.
All above three steps are organized by promise to achieve the asynchronous execution mode. In order for me to understand how the above code works, I write a simplified version for illustration:
<!doctype html>
<html>
<head>
<script>
var end;
function setupDB(){
return this.createDatabase().then(createTable).then(insertEntry).then(readEntry).then(printResult);
}
function createTable(){
return new Promise(function(resovle, reject) {
console.log("prepare to create table..." + Date.now());
this._db.transaction(function(query){
query.executeSql('create table if not exists user(id unique, user, passwd)');
});
setTimeout( _createTableOK.bind(this, resovle), 1000);
});
}
function _createTableOK(resovle){
console.log("table created successfully..." + Date.now());
resovle();
}
function createDatabase(){
return new Promise(function(resovle, reject) {
console.log("prepare to create database..." + Date.now());
this._db = openDatabase('mydb','1.0', 'JerryTestdb',1024);
setTimeout( _createDatabaseOK.bind(this, resovle), 1000);
});
}
function _createDatabaseOK(resovle){
console.log("database created successfully..." + Date.now());
resovle(this._db);
}
function insertEntry(){
return new Promise(function(resolve, reject) {
this._db.transaction(function(query){
query.executeSql("insert into user values (1,'Jerry','1234')");
});
setTimeout( _insertEntryOK.bind(this, resolve), 1000);
});
}
function _insertEntryOK(resolve){
console.log("entry inserted to table successfully..." + Date.now());
resolve();
}
function readEntry() {
return new Promise(function(resolve, reject) {
this._db.transaction( function(query) {
query.executeSql('select * from user',[],function(u,results) {
setTimeout( _readEntryOK.bind(this, resolve, results), 1000);
}); // end of query.executeSql
} // end of function(query)
); // end of this._db.transaction
});
}
function _readEntryOK(resolve, oResult){
console.log("entry readed from DB successfully..." + Date.now());
resolve(oResult);
}
function printResult(oResults){
for( var i = 0; i < oResults.rows.length; i++) {
document.writeln('id: ' + oResults.rows[i].id);
document.writeln('user: ' + oResults.rows[i].user);
document.writeln('passwd: ' + oResults.rows[i].passwd);
}
end = true;
}
function work(){
if( end ){
clearInterval(handle);
}
else{
console.log(" working..." + Date.now());
}
}
setupDB();
var handle = setInterval( work, 200);
</script>
</head>
</html>Open the html page with Chrome, and you can find that a database with name mydb and a table user is created with one record inserted.
In order to achieve the simulation that each step of webSQL is a time-consuming operation, I wrap the real logic into setTimeout with a certain time delay.
I scheduled function work to simulate the main work to do and the database related job are done in an asynchronous way organized within function module setupDB() by promise API.
The console output proves that the database operations are really executed asynchronously in exactly the same order as they are scheduled via then API of promise.
Note
Not all browsers support WebSQL and the specification of WebSQL is no longer in active maintenance.
Even in C4C frontend framework code we can see more and more usage on IndexedDB instead:
See the comparison on these two techniques from this link Migrating your WebSQL DB to IndexedDB.
要获取更多Jerry的原创文章，请关注公众号"汪子熙":
相关推荐
《SAP Cloud for Customer OData API开发者指南》是专为那些希望深入了解如何利用SAP Cloud for Customer (C4C) 平台上的OData API进行开发的IT专业人员准备的一份详尽文档。OData（Open Data Protocol）是一种开放...
SAP Cloud for Customer OData API开发人员指南《 SAP Cloud for Customer OData API开发人员指南》以最方便开发人员的格式补充了《 的用法细节和SAP Cloud for Customer OData API示例。 此外，它还涵盖了SAP Cloud...
SAP Cloud for Customer服务器端集成将SAP Cloud for Customer的功能日期Google邮箱。 使用适用于Gmail的SAP Cloud for Customer扩展，您可以利用每天使用的工具在Gmail中提高工作效率。 此扩展程序连接到SAP Cloud ...
该项目为小部件提供了一个示例实现，以将信息推送到C4C应用程序。 该演示模拟了来电或去电，以通过产品的Live Activity Center模块验证SAP Service / Sales Cloud上的集成。 注意：没有用于通过此小部件拨打实际...
SAP Cloud for Customer方案
它基于SAP Analytics Cloud (SAC)，集成了SAP Business Planning and Consolidation (SAP BPC) 的功能，旨在为企业提供一个全新的规划理念和技术平台。 首先，我们来解释什么是规划、预算编制和预测。规划是指为...
SAP Cloud Platform Connectivity的重要组成部分是Cloud Connector，这是一个在企业内部网络和SAP云平台之间建立安全通道的软件组件。Cloud Connector负责身份验证、授权和加密，确保数据传输的安全性。安装Cloud ...
Gmail:trade_mark:和SAP解决方案之间的集成与SAP Cloud for Customer，用于Google Chrome的Gmail加载项，您可以利用您每天使用的工具更加富有成效。此扩展将Gmail连接到SAP Cloud for Customer解决方案，并在电子...
SAP Cloud Platform是一个以云为基础的平台，它为用户提供了开发、扩展和运行应用程序的环境。SAP Cloud Platform支持多种服务和功能，它包括了众多的技术和服务，旨在为企业提供一个全面的解决方案，以支持从基础...
SAP Cloud Connector作为一个中间件组件，允许SAPS/4HANA Cloud与本地系统安全地通信。 此外，白皮书也探讨了客户驱动的EDI（电子数据交换）集成。客户需要在SAP API Business Hub检查可用的API，然后在SAP Cloud ...
【标题】"SAP Cloud Ap.zip"项目是一个包含示例应用程序的压缩文件，它专门针对SAP Cloud Platform（SAP云平台）设计。SAP Cloud Platform是SAP提供的一个开放的、灵活的云端开发环境，旨在帮助开发者构建、运行和...
SAP GUI for windows 800安装包，内含SAP GUI for windows 800 Patch5 补丁SAP GUI for windows 800安装包，内含SAP GUI for windows 800 Patch5 补丁SAP GUI for windows 800安装包，内含SAP GUI for windows 800 ...
SAP Cloud Platform 介绍 SAP Cloud Platform 是一...SAP Cloud Platform 是一个功能强大且灵活的云计算平台，提供了一系列的功能和服务，旨在帮助企业快速构建、部署和管理应用程序，并提供了多种语言和框架的支持。
总之，SAP S/4 HANA Cloud与SAP Cloud Security & Support Framework共同构成了一个综合性的云服务平台，旨在为客户提供安全、合规并且高效的业务解决方案。通过整合产品的安全性，操作的安全性以及公司的安全文化，...
SAP Cloud for Service正是这样一个解决方案，它整合了社交数据与公司数据，帮助企业构建出色的客户体验。 SAP Cloud for Service的核心在于团队协作和洞察客户。通过集成的系统，客户的问题和评论能够迅速传递到...
总结来说，SAP Connector for Microsoft .NET 3.0.1.0为.NET开发者提供了一个高效且全面的工具，以实现与SAP系统的深度集成。无论是WIN32还是WIN64环境，这款连接器都能帮助企业提升IT基础设施的灵活性和效能，同时...
《SAP Analysis for Microsoft Excel与EPM：深入解析与应用》 SAP Analysis for Microsoft Excel是SAP公司推出的一款强大的数据分析工具，它将SAP BusinessObjects分析功能与Microsoft Excel的灵活性相结合，为用户...
S/4HANA On-Premise版本是一个基于SAP HANA内存数据库的ERP业务套件，允许企业在私有云或公有云上部署，提供全面的功能和高度的定制性。这种部署方式适合大型企业，它们通常有复杂的业务流程和较高的定制需求，同时...
SAP HANA Cloud Platform是SAP公司提供的一个集成平台即服务（PaaS）解决方案，它旨在为开发者和企业客户构建、扩展和运行应用程序提供一个全面的平台。在这个平台上，用户可以使用SAP HANA云数据库服务，并利用各种...