ไม่ต้องสงสัยเลยว่า JavaScript การทำงานของผู้ใช้ ขอบคุณ HTML5 ให้กลไกหลายอย่างแก่เรา
1. คลาสคนงาน 1. วิธีการแนะนำ(1) การสร้างฟังก์ชั่นใหม่ผู้ปฏิบัติงาน (ARG): พารามิเตอร์แสดงไฟล์ JS ที่รหัสที่คุณต้องการเรียกใช้เช่น 'myworker.js' และคอนสตรัคเตอร์นั้นแน่นอนว่าการส่งคืนอินสแตนซ์ของคลาสคนงาน
(2) Worker.PostMessage (ข้อความ): วิธีนี้บ่งชี้ว่าการส่งข้อความจากเธรดหลักไปยังเธรดย่อยหรือเธรดย่อยส่งข้อความไปยังเธรดหลัก
(3) นอกจากนี้ยังมีเหตุการณ์ข้อความเกี่ยวกับคนงาน
คุณจะเห็นว่า API ของคลาส Woker ค่อนข้างรัดกุม
//main.html <!!!! <html lang = en> <head> <meta charset = utf-8> <title> main </title> </head> <body> </head> </head> </head> <div id = out> </div> <ประเภทอินพุต = ชื่อข้อความ = id = txt> <ปุ่ม id = btn> ส่ง </button> <script type = text/javascript> var out = document.getElementById (ออก); สคริปต์> </html> // thread1.jsonMessage tion (เหตุการณ์) {var res = event.data+หล่อ! ;
เมื่อฉันเข้าสู่กล่องข้อความที่มีขนาดใหญ่ ~ Bear คลิกปุ่มส่งจะมีเอฟเฟกต์ต่อไปนี้
การวิเคราะห์และการวิเคราะห์อย่างง่ายฉันสร้างคนงานอินสแตนซ์ของคนงานบนเธรดหลักโดย trip1.js .js ทำแล้วมัน? ใช่เขาฟังเหตุการณ์ข้อความ จากนั้นส่งกลับ เธรดหลักยังฟังเหตุการณ์ข้อความของคนงานดังนั้นข้อความจะถูกเรียกใช้ในอดีตและเนื้อหาข้อความจะปรากฏใน DIV เพื่อให้เห็นเอฟเฟกต์ข้างต้น
บางทีคุณอาจจะใช้สิ่งนี้? มันไร้ประโยชน์จริงๆที่นี่ การดำเนินงานเนื่องจากความซับซ้อนของเขาคือ O (1) (ฮ่าฮ่าเขากำลังศึกษาอัลกอริทึมเมื่อเร็ว ๆ นี้!) แต่ถ้ามันไม่ได้เป็นการดำเนินการง่าย ๆ ? ข้อได้เปรียบของวิธีนี้คือความซับซ้อนของการทำหน้าที่ของคุณทำให้คุณไม่ได้หยุดเธรดหลัก
LU จะสามารถเรียกคนงานใหม่ () เพื่อสร้างทิวทัศน์ย่อยใหม่ในเธรดย่อย ตรวจสอบเอกสารอย่างเป็นทางการและพบว่าไม่มีคำอธิบายที่เกี่ยวข้อง
ลองดูตัวอย่างของการเรียกหลาย ๆ sub -threads บนเธรดหลัก:
//main.html <!!!! <html lang = en> <head> <meta charset = utf-8> <title> main </title> </head> <body> </head> </head> </head> <div id = out> </div> <ประเภทอินพุต = ชื่อข้อความ = id = txt> <ปุ่ม id = btn> ส่ง </button> <script type = text/javascript> var out = document.getElementById (ออก); .PostMessage (postdata);}, false); out.innerText = e.data;}, false); </script> </body> </html> // thread1.jsonMessage = ฟังก์ชั่น (เหตุการณ์) {var res = event.data+หล่อ! ; ;
เธรดหลักต้องการสองเธรดเพื่อทำภารกิจหนึ่งให้เสร็จสิ้น ด้วยผลลัพธ์สุดท้ายจะปรากฏขึ้นบนหน้า
ไฟล์ js อื่น ๆ สามารถนำเสนอใน sub -threads แล้วเรียกเช่นตัวอย่างของด้านล่าง
//main.html <!!!! <html lang = en> <head> <meta charset = utf-8> <title> main </title> </head> <body> </head> </head> </head> <div id = out> </div> <ประเภทอินพุต = ชื่อข้อความ = id = txt> <ปุ่ม id = btn> ส่ง </button> <script type = text/javascript> var out = document.getElementById (ออก); );}, false); res = handler (event.data); -
จะเห็นได้ว่า Thread1.js ของเราไม่มีไฟล์ที่เรียกว่า tools.js แต่นำเข้าไฟล์ JS ผ่าน importScripts () จากนั้นคุณสามารถเรียกวิธีการที่เปิดเผยได้
ประการที่สองชั้นเรียนที่ใช้ร่วมกันEssence of Sharedworker อยู่ในการแบ่งปัน
ตัวอย่างโดยตรงเพื่อหารือ
วิธีใช้หนึ่ง://main.html <!!!!! Sharedworker ('Shared.js'); data;} </script> </body> </html> // shared.jsonconnect = function (e) {var port = e.ports [0];
นี่คือตัวอย่างจาก W3C
<! '' shared.js '); , false) ;; E.ports [0]; e.target.postMessage ('pong');
วิธีแรกคือการฟังเหตุการณ์ข้อความโดยใช้การจัดการเหตุการณ์ พวกเขาแตกต่างจากคนงาน
ดังนั้นผู้แบ่งปันข้อมูลแบ่งปันข้อมูลได้อย่างไร? โปรดดูตัวอย่างต่อไปนี้
// main1 และ main2 เป็น <! = ชื่อข้อความ = id = txt> <button id = get> get </button> <button id = set> setton> <script> var worker = คนงานที่ใช้ร่วมกันใหม่ ('Shared.js'); ('get'); ) {log.innerText = e.data;}, false); ค่า);}, false); ) {var port = e.ports [0]; port.onMessage = function (e) {ถ้า (e.data == 'get') {port.postMessage (ข้อมูล); }}
การวิเคราะห์ที่นี่เราป้อนข้อมูลในกล่องข้อความของ main1.html คลิกชุดจากนั้นคลิกวิธีการรับใน main2.html เพื่อรับข้อมูลที่เราตั้งไว้ใน main1.html กรณีเดียวเช่นเดียวกับคลาสคงที่ใน Java, No ไม่ว่าจะมีข่าวจำนวนเท่าใดจริง ๆ แล้วมีเพียงหนึ่งเดียวเท่านั้นเพื่อให้เธรดที่แตกต่างกันของเราสามารถแบ่งปันข้อมูลในงานที่ใช้ร่วมกัน นี่คือภาพ
ในที่สุดเรามาสรุปคนงานและคนงานที่ใช้ร่วมกันไม่มีการแขวนนั่นคือย้ายงานต่อหน้าเวทีเพื่อทำมันเบื้องหลังโดยไม่ขัดจังหวะการทำงานที่หน้าเวที มันเรียกว่าสิบนาทีบนเวทีและสิบปีนอกเวที วางลงเพียงด้านที่ดีที่สุดของด้านที่ดีที่สุดของคุณอยู่บนเวทีสิบนาทีก็เพียงพอแล้ว!