webwork学习
学习了H5中的webworker
主机 > 程序 > 进程 > 线程 > 纤程
多进程(重) 多线程(轻)
开销 创建、销毁开销大 创建、销毁开销小
安全性 进程之间是隔离 线程之间是共享
资源 每个进程独立资源 同一个进程的所有线程共享资源
共享资源 麻烦 方便
编程难度 低（资源是独享的） 高（资源是共享的）
总结：
多进程：性能低、编写简单
多线程：性能高、编写复杂
Java、c 多进程/多线程
PHP 多进程
JS 多进程
--------------------------------------------------------------------------------------------------------
WebWorker——浏览器上实现的多进程
Web端：
主进程 UI进程
子进程(工作进程) 看不见的；只能完成计算、数据请求这些操作
优点：
1.充分利用资源(多个进程同时工作)
2.防止主进程卡住
缺点：
不能执行任何UI操作，子进程只能执行计算型任务
结论：WebWorker在工作中用的很少——Web中计算型任务就不多
下面写了个demo:一个加法计算器
在html文件中：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <script> 7 window.onload=function (){ 8 let oBtn=document.getElementById('btn1'); 9 let oTxt1=document.getElementById('txt1'); 10 let oTxt2=document.getElementById('txt2'); 11 12 oBtn.onclick=function (){ 13 let n1=parseInt(oTxt1.value); 14 let n2=parseInt(oTxt2.value); 15 16 //1.创建子进程 17 let w=new Worker('w1.js'); 18 19 //2.发送 20 w.postMessage({n1, n2}); 21 22 //6.接收结果 23 w.onmessage=function (ev){ 24 alert(ev.data); 25 }; 26 }; 27 }; 28 </script> 29 </head> 30 <body> 31 <input type="text" id="txt1"> 32 <input type="text" id="txt2"> 33 <input type="button" value="计算" id="btn1"> 34 </body> 35 </html>
在w1.js文件中
1 //3.接收 2 this.onmessage=function (ev){ 3 //console.log('我得到了：', ev.data); 4 5 //4.处理任务 6 let sum=ev.data.n1+ev.data.n2; 7 8 //5.返回 9 this.postMessage(sum); 10 };
