HTML5の前に、JavaScriptはブラウザで実行されています。マルチスレッドシミュレーション（SetIntervalメソッド、SetimeOutメソッドなど。JavaScriptなど）を実装する多くの方法がありましたが、本質的に、プログラムはJavaScriptエンジンによって単一の読み方で実行されます。 HTML5で導入されたワーカースレッドは、ブラウザサイドのJavaScriptエンジンがJavaScriptコードを同時に実行できるようにするため、ブラウザサイドマルチスレッドプログラミングの優れたサポートを実現できます。
JavaScriptのマルチスレッド-Webworker HTML5のWebワーカーは2つの異なるスレッドタイプに分けることができます。1つは専用のスレッド専用ワーカーで、もう1つは共有スレッド共有ワーカーです。 2種類のスレッドには使用が異なります。特別なウェブワーカー献身的な労働者がそれを作成したスクリプトに接続されています。他のワーカーやブラウザコンポーネントと通信できますが、DOMと通信することはできません。専用の意味は、このスレッドが一度に1つの要件のみを処理することです。専用のスレッドは、IEを除くさまざまな主流のブラウザに実装されており、自信を持って使用できます。
スレッドを作成しますワーカーを作成するのは簡単です。スレッドでコンストラクターに実行する必要があるJavaScriptファイルのファイル名を渡すだけです。
スレッド通信メインスレッドとチャイルドスレッド間の通信は、スレッドオブジェクトのメッサージ後のメソッドと無視方法を使用します。誰に誰に送信しても、送信と送信はメサージ後の方法を使用し、受信者はデータを受信するためにonmessageメソッドを使用します。 Postmessageには1つのパラメーターのみ、つまり渡されたデータがあり、Onmessageにはパラメーターが1つだけです。イベントであると仮定し、受信したデータはevent.dataを通じて取得されます。
JSONデータを送信しますJSONは、JSによってネイティブにサポートされているものです。何のためにも使用する必要はありません。 JSONで複雑なデータを使用するだけです。例えば：
postmessage（{'cmd'： 'init'、 'timestamp'：date.now（）}）;
取り扱いエラースレッドでエラーが発生すると、Onerrorイベントコールバックが呼び出されます。したがって、エラーに対処する方法は非常に簡単です。これは、スレッドインスタンスのOnerrorイベントをマウントすることです。このコールバック関数にはパラメーターエラーがあり、これには3つのフィールドがあります。メッセージ - エラーメッセージ。ファイル名 - エラーが発生したスクリプトファイル。リネノ - エラーが発生した線。
スレッドを破壊しますスレッド内で、閉じる方法を使用して自分自身を破壊します。スレッドの外側のメインスレッドでは、スレッドの終了方法を使用してスレッドを破壊します。
以下は、スレッドの基本的な操作を確認する例です。
HTMLコード：
<！doctype html>
<html>
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<Title> Webワーカーfibonacci </title>
<script type = "text/javascript">
onload = function（）{
var Worker = new Worker（ 'fibonacci.js'）;
worker.onmessage = function（event）{
console.log（ "result：" + event.data）;
};
worker.onerror = function（error）{
console.log（ "error：" + error.message）;
};
worker.postmessage（40）;
}
</script>
</head>
<body>
</body>
</html>
スクリプトファイルfibonacci.jsコード：
//fibonacci.js
var fibonacci = function（n）{
n <2を返しますか？ n：arguments.callee（n -1） + arguments.callee（n -2）;
};
onmessage = function（event）{
var n = parseint（event.data、10）;
ポストメサージ（fibonacci（n））;
};
それらを同じディレクトリに入れ、ページファイルを実行し、コンソールを表示して実行の結果を確認します。
ここには別のポイントがあります。メインスレッドでは、Onmessageイベントを別の方法でフックすることができます。
worker.addeventlistener（ 'message'、function（event）{
console.log（ "result：" + event.data）;
}、 間違い）;
個人的には非常に厄介だと思うので、直接Onmessageを使用してみませんか。
他のスクリプトファイルを使用しますワーカーは、グローバルメソッドインポートスクリプトを使用して、他のドメイン内スクリプトファイルまたはクラスライブラリをロードおよび使用できます。たとえば、以下は使用する法的方法です。
importscripts（）;/ * Nothing */ *
importscripts（ 'foo.js'）; / * Just "foo.js"をインポート */
importscripts（ 'foo.js'、 'bar.js'）;/ * 2つのスクリプト */ *
インポート後、これらのファイルでメソッドを直接使用できます。オンラインで小さな例を参照してください：
/**
* ImportScriptsメソッドを使用して外部リソーススクリプトを紹介します。ここでは、数学式計算ツールライブラリMath_utilities.jsを使用します。
* JavaScriptエンジンがこのリソースファイルをロードする場合、次のコードを実行し続けます。同時に、次のコードにアクセスして呼び出すことができます
*リソースファイルで定義されている変数とメソッド。
**/
importscripts（ 'math_utilities.js'）;
onmessage = function（event）
{
var first = event.data.first;
var second = event.data.second;
計算（最初、2番目）;
};
関数計算（最初、2番目）{
//計算作業を行います
var common_divisor = divisor（最初、2番目）;
var common_multiple = multiple（first、second）;
PostMessage（ "仕事が完了！" +
「最も一般的でない倍数は」 + common_divisor +です
「そして、最大の共通の仕切りは」+common_multiple）;
}
インターネット上の一部のネチズンは、ここでImportScriptsメソッドを使用してリソースのプリロードの問題を解決することを考えました（ブラウザはリソースを解析して実行せずにリソースをプリロードします）。その理由も非常に簡単です。
ネスティングスレッドワーカースレッドでは、子スレッドを作成することもでき、さまざまな操作が同じです。
同期の問題ワーカーにはロックメカニズムがなく、マルチスレッドの同期問題はコード（信号変数の定義など）でのみ解決できます。
Sharedwebworker共有Webワーカーは、主に複数の接続の同時性の問題に適しています。複数の接続に対処する必要があるため、APIは献身的な労働者とはわずかに異なります。これに加えて、献身的な労働者のような共有Web労働者はDOMにアクセスできず、フォームプロパティへのアクセスも制限されています。共有されたWebワーカーもコミュニケーションを越えられません。ページスクリプトは共有Webワーカーと通信できますが、専用のWebワーカーとはわずかに異なります（暗黙のポート通信を使用）は、ポートオブジェクトを使用してメッセージイベントハンドラーを添付することにより、通信が明示的に実行されることです。
Webワーカースクリプトから最初のメッセージを受信した後、共有Webワーカーはイベントハンドラーをアクティブ化されたポートに添付します。一般に、ハンドラーは独自のPostMessage（）メソッドを実行して呼び出しコードにメッセージを返し、ポートのstart（）メソッドは有効なメッセージプロセスを生成します。
インターネットで見つけることができる唯一の例を見てください。共有スレッドを作成して、異なる接続から送信された命令を受信し、独自の命令処理ロジックを実装します。命令処理が完了すると、結果はそれぞれの異なる接続されたユーザーに返されます。
HTMLコード：
<！doctype html>
<html>
<head>
<メタcharset = "utf-8">
<Title>共有労働者の例：HTML5で共有労働者の使用方法</title>
<スクリプト>
var Worker = new SharedWorker（ 'SharedWorker.js'）;
var log = document.getElementById（ 'Response_From_Worker'）;
worker.port.addeventlistener（ 'message'、function（e）{
// Webページで応答データをログに記録します
log.textContent = e.data;
}、 間違い）;
worker.port.start（）;
worker.port.postmessage（ 'ユーザーWebページからのping ..'）;
//次のメソッドは、共有ワーカーにユーザー入力を送信します
function postmessagetosharedworker（input）
{
//リクエストを作成するJSONオブジェクトを定義します
var命令= {命令：input.value};
worker.port.postmessage（命令）;
}
</script>
</head>
<body onload = ''>
<出力ID = 'Response_From_Worker'>
共有ワーカーの例：HTML5で共有労働者の使用方法
</output>
共有労働者に手順を送信します：
<input type = "text" autofocus oninput = "postmessagetosharedworker（this）; return false;">
</input>
</body>
</html>
スクリプトファイルコード：
//異なる接続から送信される手順を受信する共有スレッドを作成します。命令処理が完了すると、結果はそれぞれの異なる接続されたユーザーに返されます。
var connect_number = 0;
onconnect = function（e）{
connect_number = connect_number+ 1;
//ここで最初のポートを取得します
var port = e.ports [0];
port.postmessage（ '新しい接続！現在の接続番号は'
+ connect_number）;
port.onmessage = function（e）{
// requesterから指示を取得します
var struction = e.data.instruction;
var results = execute_instruction（命令）;
port.postmessage（ 'request：'+destions+'response'+結果
+'共有労働者から...'）;
};
};
/*
*この関数は、リクエスターから送信される手順を実行するために使用されます
* @param命令
* @戻る
*/
関数execute_instruction（命令）
{
var result_value;
//ここでロジックを実装してください
//命令を実行します...
return result_value;
}
上記の共有スレッドの例では、メインページ、つまり各ユーザー接続ページに共有スレッドオブジェクトが構築され、受信ユーザーの指示を共有スレッドに送信するメソッドが定義されています。同時に、Connect_Numberは共有スレッドの実装コードスニペットで定義され、共有スレッドに接続された総数を記録します。その後、OnConnect Event Processorを使用して、異なるユーザーからの接続を受け入れ、合格する指示を解析します。最後に、ユーザーの命令を実行するためにメソッドexecute_instructionが定義されています。命令の実行が完了すると、結果は各ユーザーに返されます。
ここでは、前の例のように、ワーカースレッドのMessageイベントハンドラーを使用しませんでしたが、別の方法を使用してEventListenerを使用しました。実際、前述のように、これら2つの実装原則は基本的に同じですが、ここにはわずかな違いがあります。 AddEventListenerを使用して共有スレッドからのメッセージを受け入れる場合、最初にWorker.port.start（）メソッドを使用してこのポートを開始する必要があります。その後、通常、ワーカースレッドの使用方法と同じようにメッセージを受信して送信できます。
最終声明スレッドでできること：1。Settimeout（）、ClearTimeout（）、SetInterval（）、ClearInterval（）、およびその他の関数を使用できます。
2。ナビゲーターオブジェクトを使用できます。
3. XMLHTTPREQUESTを使用してリクエストを送信できます。
4.スレッドでWebストレージを使用できます。
5.自己を使用して、スレッド内のこのスレッドの範囲を取得できます。
スレッドでできないこと：1。Navigator以外のDOM/BOMオブジェクトは、ウィンドウやドキュメントなどのスレッドでは使用できません（操作する場合は、ワーカークリエーターにのみメッセージを送信し、コールバック関数を介して動作できます）。
2。メインスレッドの変数と関数は、スレッドでは使用できません。
3。サスペンド効果を備えた操作コマンドは、アラートなどのスレッドでは使用できません。
4。JSは、スレッド内のドメイン間にロードできません。
また、スレッドにはリソースの消費が必要であり、スレッドを使用すると複雑さももたらすため、追加のスレッドを使用する十分な理由がない場合は、それらを使用しないでください。
実用的な参照公式文書：http：//www.whatwg.org/specs/web-apps/current-work/multipage/workers.html
Webworkerの分類説明：http：//www.w3schools.com/html5/html5_webworkers.asp
テンプレートの心配：http：//www.cuoxin.com/w3school/html5/
Webworkerの概要：https：//developer.mozilla.org/en/using_web_workers