Apps Scriptリファレンス: Apps Script Reference |障害・課題追跡: IssueTracker |Google Workspace: Status Dashboard - Summary

2019年5月17日金曜日

JavaScriptでPromiseを使ってみる2


Promiseで以下の処理を作った時の備忘録
  1. コンソールに 1 を表示する
  2. promiseオブジェクトを作る
  3. コンソールに 2 を表示する
  4. 2秒後にHelloをresolveに渡す
  5. その後、コンソールに 3 と手順4の Hello に World をつけて表示する



コード.gs
function doGet() {
  return HtmlService.createHtmlOutputFromFile("index");
}
意訳
この機能がやること
指定したHTMLファイルを表示する




index.html
<!DOCTYPE html>
<html>
<body>
  
<script>
run();

function run() {
  console.log('1');
  var promise1 = new Promise(function(resolve, reject) {
    console.log('2');
    setTimeout(function(){
      resolve('Hello');
    }, 2000);
  })
  promise1.then(function(value) {
    console.log('3 ' + value + ' world');
  })
}

</script>
</body>
</html>
意訳
 




run()を実行する

この機能がやること
コンソールにログを出す
promise1のpromiseオブジェクトを作成する
コンソールにログを出す
タイムアウト設定して
resolveにHelloを渡す
2秒後に実行する

promise1の処理の後
渡されたvalueをログに出す










実行結果




index.htmlの中の処理を分けてpromiseを外の関数に渡してみる

index.html
<!DOCTYPE html>
<html>
<body>
  
<script>
run();

function run() {
  console.log('1');
  var promise1 = promise1Function();
  promise1.then(function(value) {
    console.log('3 ' + value + ' world');
    }
  )
}

function promise1Function() {
  var promise1 = new Promise(function(resolve, reject) {
    console.log('2');
    setTimeout(function(){
      resolve('Hello');
    }, 2000);
  })
  return promise1;
}
</script>
</body>
</html>
意訳
 




run()を実行する

この機能がやること
コンソールにログを出す
promise1Functionのpromiseオブジェクトを取得する
promise1Functionのあと、渡された値をvalueで受けて
コンソールに出力する




この機能がやること
promiseオブジェクトを作成して
コンソールにログを出す
タイムアウト設定して
resolveにHelloを渡す
2秒後に実行する

promiseオブジェクトを返す






実行結果




index.htmlのpromise1.thenの中のfunctionの処理を外に書いてみる

index.html
<!DOCTYPE html>
<html>
<body>
  
<script>
run();

function run() {
  console.log('1');
  var promise1 = promise1Function();
  promise1.then(function(value) {promiseThen1(value);}
  )
}

function promise1Function() {
  console.log('2');
  var promise1 = new Promise(function(resolve, reject) {
    setTimeout(function(){
      resolve('Hello');
    }, 2000);
  })
  return promise1;
}

function promiseThen1(value) {
  console.log('3 ' + value + ' world');
}

</script>
</body>
</html>
意訳
 




run()を実行する

この機能がやること
コンソールにログを出す
promise1Functionのpromiseオブジェクトを取得する
promise1のあと、渡された値をvalueで受けてpromiseThen1に渡す



この機能がやること
コンソールにログを出す
promiseオブジェクトを作成して
タイムアウト設定して
resolveにHelloを渡す
2秒後に実行する

promiseオブジェクトを返す


この機能がやること
渡されたvalueをログに出す








Latest post

Google Workspace Business版でプロフィール画像を変更できるようにしたい

Google Workspace Business版でプロフィール画像を設定後、画像を変えられない場合 Admin console のDirectory の中にある Profile Picture をチェックしてみる Adminアカウントで  https://admin.goog...