Web Worksが使えるか確認
WebWorkersが使えるかは
windowオブジェクトに
Workerオブジェクトがあるか調べる
var ele=document.getElementById(“result”);
//WebWorkersが使えるか確認
if(!window.Worker){
ele.innerHTML=”WebWorkersが使えません”;
return;
}
次に、ワーカー作成
今回は、句読点変換ボタンがクリックされたときの処理
document.getElementById(“convert1”).addEventListener(“click”,fuction(){
var text=document.getElementById(“sourcetext”).value;
var myworker=new Worker(“js/convert1.js”);
myworker.onmessage=fuction(evt){
ele.innerHTML=evt.data;
}
myworker.postMessage(text);
},true);
では、解説
イベントハンドラでは、
テキストエリアに入力された文字列を読み出す
ソースは
var text=document.getElementById(“sourcetext”).value;
次に、new Worker()で
Workerオブジェクトを作成して
引数へ、Javascriptのパス
もしくは、URLを指定する
ソースは
var myworker=new Worker(“js/convert1.js”);
ここで指定するJavascriptは、
Worker専用にすること
理由は、DOM操作のコードがあると
エラーが発生するため
注意すべきは、Workerオブジェクトを作成した時点で
すぐに、ファイルが読みこまれ、実行までされること
ライブラリ指定のように、読み込みだけではないところに注意
読み込んだ時点で実行されるため
Workerオブジェクトへデータを渡すこともできないし
呼び出し元にデータや結果を、渡すこともできない
そのため、読み込みに指定するファイルは
イベントハンドラだけ定義して
何も処理しないようにしている
ちなみに、worker内で定義した関数や変数は
呼び出し元とは違う扱いになるため
名前が同じでも違うものとして認識されるらしい
関数のスコープの区切りの感覚にちかいかもしれない