記録

demo23、javascriptの非同期同期処理?

今日はJavaScriptで非同期、同期処理のことに付いて考えてみた。関数を呼び出して返却の値を変数に渡す処理を作って頂けると非同期処理と同期処理の違いがわかるかと思います。例えばこういうJSの処理があるとします。

document.getElementById("btn").addEventListener("click",(e)=>{
	var a = test1();
	var b = test2().then(b =>{
		console.log(b);	
		return b;
	});;
	var c = test3().then(c =>{
		console.log(c);	
		return c;
	});
	console.log("btn =" + a);
	console.log("btn =" + b);
	console.log("btn =" + c);
});

function test1(){
	return 1;
}
async function test2(){
	return await 2;
}
async function test3(){
	return 3;
}

こちらの処理を試すと結果、このような内容がデバックモードで表示されます。予想通りの結果が返ってきましたか?それとも予想外の結果が返ってきましたか?

asyncが付いていてawaitがついてない場合とついている場合とでは違いの差がわかるかと思います。いろいろと試してみると非同期処理の応用が出来るかと思います、逆に言えば上手く非同期処理を使いこなすことが出来るとコードが短縮出来たり、効率的に回せるのではないかと思います。自分もこれらを使っていろいろと作ってみたいですね(´Д`)。因みに今回、Promiseを簡略化したパターンでコードを書いています。

尚、Demo23にはデモコードが存在しますので動作を検証してみてください。
https://www.zip358.com/tool/demo23/

活動支援よろしくお願いします

マウスの動きをトラッキング(追跡)する。前のページ

映画、記者たち 衝撃と畏怖(いふ)の真実を観ました。次のページ

関連記事

  1. 記録

    PHP忘れてしまいそう。

    こういう書き方とか書かなかったら忘れてしまいそうですね。クラスの…

  2. 記録

    そろそろ日本もフィンテックかも。

    https://www.youtube.com/watch?v=FJ…

  3. 記録

    高知県で活動するWEBクリエーター等の情報交換サイト(非公開BBS:現在制作中)です。

    高知県で活動するWEBクリエーター等の情報交換サイト(非公開BBS:…

  4. 記録

    言いにくいbluetooth[ブルートゥース]が音飛びするよ。

    言いにくいbluetoothが音飛びするよ。最初に解決方法を教…

  5. 記録

    HTML5のCanvasをトライ。

    会社でCanvasのことを聞かれたのだけどさっぱりだったので触って…

  6. 記録

    自然体が2人ぐらいいる。(笑:2017)

    https://www.youtube.com/watch?v=6_X…

2020年11月
 1
2345678
9101112131415
16171819202122
23242526272829
30  

カテゴリー

PAGE TOP