C語言實現檔案讀寫
阿新 • • 發佈：2020-12-29
技術標籤：workerjavascript
文件參照地址：http://www.ruanyifeng.com/blog/2018/07/web-worker.html
基本用法：index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script> $(function () { // 主執行緒採用new命令，呼叫Worker()建構函式，新建一個 Worker 執行緒。 var worker = new Worker('./js/worker.js'); // 主執行緒呼叫worker.postMessage()方法，向 Worker 發訊息。 worker.postMessage('Hello World'); // worker.postMessage({method: 'echo', args: ['Work']}); // 主執行緒通過worker.onmessage指定監聽函式，接收子執行緒發回來的訊息 worker.onmessage = function (event) { // console.log('Received message ' + event.data); doSomething(event.data); console.log('222222'); } function doSomething(data) { // 執行任務 // worker.postMessage('Work done!'); console.log(data); } console.log(333333); // Worker 完成任務以後，主執行緒就可以把它關掉 // worker.terminate(); }) </script> </body> </html>
示例：1：主執行緒 worker.html
建立4個主執行緒，分別向子執行緒傳送資料，並接受處理子執行緒返回資料
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.0/axios.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script> </head> <body> <script> $(function () { const num = 4; for(let i=0; i< num; i++){ // 主執行緒採用new命令，呼叫Worker()建構函式，新建一個 Worker 執行緒。 var worker = new Worker('./js/worker.js'); worker.postMessage(i); worker.onmessage = function (event) { console.log(event.data); } } }) </script> </body> </html>
2：子執行緒
接受主執行緒傳送得資料，並將處理後得資料傳送給主執行緒
self.addEventListener('message', function (e) {
var data = e.data;
self.postMessage('子執行緒已接受到資料：' + data * 2);
}, false);
3：結果列印
