JS - Web Workers如何工作?

时间:2016-11-03 12:35:46

标签: javascript html

我正在处理这段代码:

JS

<script  src='file://C:\blablabla\JavaScript\bignumber.js-master\bignumber.js'></script>
<script>
    document.write("<h1>\"blabla\"</h1>\n<h3>blabla</h3>");

    function problem(){
        var img = document.getElementById('problemi');
        return img.style.display = img.style.display === 'block' ? 'none' : 'block';
    }

    function problem551(){
        problem();
        var t0 = performance.now();
        var max = 1e+15;
        var sum = new BigNumber(1);
        for(var i=1;i<max;i++)
            sum = sum.plus(scomponi(sum,0));
        var t1 = performance.now();
        document.getElementById("p551").innerHTML = 'blabla<span>'+max+"</span> blabla <span>" + sum +"</span> in <span>"+(t1 - t0)/1000+"</span> blaaa"; 

    }

    function scomponi(num,sum){
        var str=num.toString();
        for(var i = 0 ; i< str.length ;i++ ){
            sum += parseInt(str[i]);
        }
        return sum;
    }


</script>

HTML

<body>
    <div>
        <button onclick="problem551()" >PROBLEM 551</button>
        <img id="problemi" src="PROBLEM551.png" style="display: none;">
        <p id="p551"></p>
    </div>
</body>

但Chrome崩溃了,它给了我这个:

error

如何防止我的函数出现此错误,他有一个从1到1e + 15的循环,因此需要花费太多时间。我读了一些关于WEB WORKERS的内容,但对我来说无人问津。我想在我的函数 problem551()上使用它,所以有人可以解释一下它是如何工作的?

1 个答案:

答案 0 :(得分:0)

将您的功能移至新文件funcs.js

并使用new Worker("funcs.js")启动它。

您可以使用postMessage按照MDN中描述的方式发回结果:

  

向专用工作人员发送消息

     

工人的魔力通过postMessage()方法和   onmessage事件处理程序。当你想发送消息时   工人,你像这样(main.js)发布消息:

first.onchange = function() {
  myWorker.postMessage([first.value,second.value]);
  console.log('Message posted to worker');
}

second.onchange = function() {
  myWorker.postMessage([first.value,second.value]);
  console.log('Message posted to worker');
}
     

所以这里我们有两个由变量表示的元素   第一和第二;当两者的值发生变化时   myWorker.postMessage([first.value,second.value])用于发送   作为数组,在worker内部的值。你可以发送很多   你喜欢的任何消息。

     

在工作人员中,我们可以通过写作收到消息   像这样的事件处理程序块(worker.js):

onmessage = function(e) {
  console.log('Message received from main script');
  var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
  console.log('Posting message back to main script');
  postMessage(workerResult);
}

预计它仍然需要花费很多时间,这是一个相当长的操作,但它有望阻止Chrome提出错误。

我看到你正试图解决Project Euler问题551。

你丢掉了一条有价值的信息:

  

您获得了a_10 ^ 6 = 31054319。

您不需要从1开始迭代。下一个数字可以是序列中的任何任意数字。

a_10^6 = 31054319

a_(10^6 + 1) = 31054319 + 3 + 1 + 0 + 5 + 4 + 3 + 1 + 9