javascriptの処理が非同期なため困っています。

Question

javascriptの処理が非同期処理なためGASの処理が終わる前に次にいき上手く処理が回りません。
これを上手く処理が流れるようにJavascruiptとGASを同期処理させたいです。

●具体的な内容
javascriptの変数をGoogleスプレッドシートのセルに反映させたい。

for(i = 0; i < 10; i++){

new Promise((resolve) => {
google.script.run
.write(str);//////ここでは省略していますが、strは変数で+iで変更される様にしています。
}, 1000);
}

GASの方で繰り返しで送られてくる変数を4行目の下に追加していく流れです。

function write(aa) {
  var sheet = openSheet();
//最終行を取得
  var maxRng_nyusyuko = sheet.getRange(sheet.getMaxRows(), 4);

  var lastRng_nyusyuko = maxRng_nyusyuko.getNextDataCell(SpreadsheetApp.Direction.UP);
  Logger.log(lastRng_nyusyuko.getA1Notation()); 

//最終行のセルをアクティブ化して、一個下のセルに情報を追加
  const range_nyusyuko = sheet.getRange(lastRng_nyusyuko.getA1Notation());
  range_nyusyuko.offset(0, 0).activate();

　let activeCell_nyusyuko = sheet.getActiveCell();
　let selectedRow_nyusyuko = activeCell_nyusyuko.getRow();
　let selectedColumn_nyusyuko = activeCell_nyusyuko.getColumn();
　sheet.getRange(selectedRow_nyusyuko+1, selectedColumn_nyusyuko).setValue([aa]) 
resolve();
}

この処理流すと、javascriptの非同期なためGASのコードが回るきる前に次の変数を渡しセルの数や順番がごちゃごちゃになります。

試したこと
・待機時間を設ける　→　意味なし。状況に変化なし
・Promiseを用いる　→　resolve();をGAS側に付けるとエラー　Uncaught at aa

Comments

[ku__ra__ge]

withSuccessHandler
https://developers.google.com/apps-script/guides/html/reference/run#withsuccesshandlerfunction
を使うとよさそう。
GASの処理が終了したときにresolveされるPromiseを返す関数を自作して、async/awaitで書くときれいに処理できると思う。

Answer 1

試してないけどこういうコードでうまくいくと思う。

function GasWriteAsync(str) {
	return new Promise(resolve => {
		google.script.run
			.withSuccessHandler(resolve)
			.write(str);
	});
}

(async () => {
	for(i = 0; i < 10; i++){
		// strは変数で+iで変更される前提
		await GasWriteAsync(str);
	}
})();

Comments

[aRyo]

回答ありがとうございます。
早速試してみたのですが、今までと同様な処理となってしまいました。

GASの処理が重たすぎるのでしょうか。

[ku__ra__ge]

じゃああと試すべきは固定でウエイトを入れてみるとかですかね。
以下は3秒ごとにiを出力するサンプルなのでこれを参考に3秒ごとにGAS関数を呼び出すとかすればとりあえずうまくいくと思います。
(async () => {
for(i = 0; i < 10; i++){
await new Promise(resolve=>setTimeout(resolve, 3000));
console.log(i);
}
})();

[aRyo]

回答頂いた方法で試してみました。
今回の場合、変数の値が毎回変わるようになっているのですが、教えて頂いた方法だと最後の変数の値が10回分表示されるだけでした。（非同期処理のためかと思われます。）

//ここでは省略していますが、strは変数で+iで変更される様にしています。

[ku__ra__ge]

私がコメントで提示したコードは（最後の変数の値ではなく）0～9を正しく表示できます。
あなたの書いたコードとどこが違うか比較して問題を解決してください。

[aRyo]

出来ました！！
少し書き方が違いました。そこを修正したら流れました。
一週間以上悩んでいた部分なので、本当にありがとうございました。
感謝です！！！

[ku__ra__ge]

おめでとうございます。
これを機にPromiseオブジェクトの概念を理解しておくと、自分で非同期処理を書くときや近代的なライブラリを使うとき役立ちます。

[aRyo]

お世話になります。昨日は回答ありがとうございました。
単体での処理は、昨日の回答で出来るようになりました。
しかし、複数の同期処理を行うと途中で動かなくなります。この処理を100回ほど繰り返したいのですがたった二つの処理だけで止まるので困っています。
もし、アイデアなどあれば教えていただけると幸いです。
https://teratail.com/questions/375935?modal=q-comp

Answer 2

google.script.runは使ったことないのですが、軽く見てみると非同期で処理を呼び出しているようなので、GAS側の処理の完了を待たずに次のループに進んでしまうようです。
google.script.runの完了を確実に待ちたいのであればPromiseでラップする方法がよいと思われます。検索すると幾つか例が見つかります。
アイデアレベルの回答しかできませんが、参考になれば試してみてください。