JavaScript(Webブラウザ作成原理/JS動作原理)

JavaScriptは常に同期処理(同期)

<script>
  console.log(1); 
  console.log(2); 
  console.log(3);
</script> // 1,2,3 차례대로 출력

JavaScriptは非同期処理(非同期)も可能

の特殊コードが見つかった場合は、少し横に置いて、他のコードから

を実行します.

console.log(1);
setTimeout(function(){console.log(2);}, 1000);
console.log(3); // 1,3 출력 (1초후) 2 출력

処理に時間がかかるコード(ex.ajaxリクエスト、イベントリスナー、settimeout)を実行すると、スタックではなくスタックが一時的に保持されます.(ブラウザはC++言語で構成されています.ブラウザが実行するJavaScriptコードを見つけた場合は、C++言語で作成したスタックに入れます.)

実行の準備ができたら、キューに入り、キュー内のコードがスタックに移動して実行されます.ただし、スタックは空の状態で実行できます.

100億回サイクルのコードを実行する必要がある場合は?

for (let i = 0; i < 1e10; i++) {
  i++;
}

1.settimeoutを使用します.
settimeout()を利用して0秒ごとに0~1億回、1億~2億回、2億~3億回繰り返す...
これにより、コードを実行すると、タスクをより簡単に実行できます.
Queueは0秒ごとに送信されるので,その間にユーザのイベントリスナーなどのコードを実行することができる.
(settimeoutタイマを0秒に設定した場合、実稼働時間は4 ms、設定可能最小時間は4 ms)
2.Web Workerを使用します.
別のJavaScriptファイルの使用
このファイルでは難しい演算を行い、完了するとコマンドで値を取得できます.
作成したWorkerクラスを使用します.
worker.jsでは、タスクの完了時にpostMessage()を実行すると、完了した結果値を他のファイルに渡すことができます.
注:mdn web docs、簡単なwebworkerの整理

(메인 js 파일)
var myWorker = new Worker('worker.js'); 
w.onmessage = function(e){
  console.log(e.data) //이러면 1 나올듯
};
----------------------------------------
(worker.js 파일)
var i = 0;
postMessage(i + 1); //postMessage라는 특별한 함수가 있음

2つの関数を順次出力したい場合は?

1番目の関数の1を出力し、2番目の関数の2を順次出力する場合は、Pythonのような言語で、次のコードが正常に動作します.

function 첫째함수(){
  console.log(1)
}
function 둘째함수(){
  console.log(2)
}
첫째함수(); //1 출력
둘째함수(); //2 출력

javascriptは非同期の特殊性であるため,上記の記述を順次実行することは保証されない.最初の関数にsettimeoutまたはWeb APIスタンバイに送信されるコードがある場合は、後で実行されます.)
したがって,1番目の関数に2番目の関数にパラメータ値を与え,パラメータ値に関数自体を与え,関数を関数内で実行させる方法である.そうであれば、最初の関数を無条件に実行し、次に2番目の関数を実行します.

function 첫째함수(콜백){
  console.log(1);
  콜백();
}
function 둘째함수(){
  console.log(2)
}
첫째함수(둘째함수);

コールバック関数地獄の欠点

順次実行するために、複数のコールバック関数を使用すると、コードが長くなり、コールバック関数を匿名関数に渡すプロセスが繰り返され、コードのインデントが耐えられないほど深まります.主にイベント処理やサーバ通信などの非同期タスクを実行するためであるが,この形式はしばしば現れるが,可読性が悪いためコードの修正が困難である.
従って、コールバック関数に代わるpromise設計モード−https://velog.io/@pjh1011409/JavaScriptPromiseasyncawaitが存在する