-= 和网络工作者的错误

Question

我正在用 JS 开发一个小游戏，我正在使用许多网络工作者来管理我的敌人。这是我的 ennemis.js 代码（这是我的网络工作者）：

var xEnnemis, nbrEnnemis;
var x=0;
//Seul objectif : calculer les positions des ennemis.
onmessage = function(e) {
    var idEnnemis = String(e.data[0]);
    var recXEnn = String(e.data[1]);




    xEnnemis = recXEnn;
    var recSpeedEnn = String(e.data[2]);
    vitesseEnnemis = recSpeedEnn;

    animationEnnemisInterval = setInterval(calculateEnnemisPos, 120); //60

    function calculateEnnemisPos(){
            if (xEnnemis>0){
                xEnnemis -= vitesseEnnemis;
            }else{
                xEnnemis=0;
            }
        //console.log("Send datas + "+ idEnnemis);
        postMessage([idEnnemis, xEnnemis]);
    } 
}

这是我的主要脚本

if (typeof(Worker) !== "undefined") {console.log("Tu supportes les workers  !")} else {console.log("Sorry bro...");} 
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext('2d');
//ENEMIE
var nbrnnemis = 3; //Math.floor(Math.random() * (3 - 5 + 1) ) + 5;
var ennemie = new Image();
ennemie.src = "media/zombie.png";
var xEnnemisGen = [];
var vitesseEnnemis = [];
var posEnnemisrecue = [];
var ennemisRecu = 0;
var animZombie=0;
for (i=0;i<nbrEnnemis; i++){
    var w = new Worker('ennemis.js');
    xEnnemisGen[i] = 500;
    //xEnnemisGen[i] = Math.floor(Math.random() * (1401 - 1290 + 1) ) + 1281;
    vitesseEnnemis[i] = Math.floor(Math.random() * (4 - 10 + 1) ) + 4;
    //console.log("Envoyé au worker : " +i + " " + xEnnemisGen[i] + " " + vitesseEnnemis[i] );
    w.onmessage = test;
    w.postMessage([i, xEnnemisGen[i], vitesseEnnemis[i]]);
}
console.log("Nombres d'ennemis : " + nbrEnnemis);
//console.log(xEnnemis);
function test(e){
    var id = String(e.data[0]);
    var position = String(e.data[1]);
    //console.log("Just received "+e.data+ " from Worker !"); //fait ramer de ouf
    console.log("Recu la position: "+position+" avec l'id: " +id);
    posEnnemisrecue.push(position);
    ennemisRecu++;
    if (ennemisRecu == nbrEnnemis){
        if (animZombie==23){animZombie=0;}else{animZombie+=1;}
        for (i=0;i<nbrEnnemis;i++){
            ctx.drawImage(ennemie, animZombie*118,0, 118,177, posEnnemisrecue[i], 500, 118,177);
            console.log("c'est dessiné + "+ posEnnemisrecue[i]);
        }
        posEnnemisrecue=[];
        ennemisRecu = 0;
        //ctx.clearRect(0,0,1280, 720);
        ctx.drawImage(ennemie, animZombie*118,0, 118,177, 0, 0, 118,177);
        console.log(animZombie);
        console.log("dessiné " + animZombie);
    }
}

但有时我的 web worker 发送的 xEnnemis 的值并没有减少；正如我们在此日志中看到的那样，它甚至会增加：

dessiné 6
Recu la position: 500 avec l'id: 2
Recu la position: 0 avec l'id: 1
Recu la position: 0 avec l'id: 0
c'est dessiné + 500
c'est dessiné + 0
7
dessiné 7
Recu la position: 500 avec l'id: 2
Recu la position: 0 avec l'id: 1
Recu la position: 0 avec l'id: 0
c'est dessiné + 500
c'est dessiné + 0

你知道为什么吗？谢谢！

编辑：五四，C.Champagne版本测试后

好的，刚测试过，好像不行。字符串不是答案。无论如何感谢您的帮助！

新日志：

dessiné 15
Recu la position: 0 avec l'id: 0
Recu la position: 2100 avec l'id: 1
Recu la position: 0 avec l'id: 2
c'est dessiné + 0
c'est dessiné + 2100
c'est dessiné + 0
16
dessiné 16
Recu la position: 0 avec l'id: 0
Recu la position: 2101 avec l'id: 1
Recu la position: 0 avec l'id: 2
c'est dessiné + 0
c'est dessiné + 2101
c'est dessiné + 0
17
dessiné 17
Recu la position: 0 avec l'id: 0
Recu la position: 2102 avec l'id: 1
Recu la position: 0 avec l'id: 2
c'est dessiné + 0
c'est dessiné + 2102
c'est dessiné + 0
18

如您所见，它还在增加。我想知道这是否不是我主脚本的 test(e) 函数的错，它一次被调用太多次并且什么都不做。

刚在Chrome上测试过，看是不是导航器错误，也是一样。如果你有任何想法，因为我被卡住了。提前致谢！

编辑：2018 年 5 月 7 日

好的伙计们，刚发现！这是因为

vitesseEnnemis[i] = Math.floor(Math.random() * (4 - 10 + 1) ) + 4;

returns 有时值错误！我不知道为什么，但这里有一些结果

Array [ -1, 0, -1 ]

如您所见，我将继续调查。如果您遇到过同样的问题，请评论此 post ！

提前致谢！

Escatrag

Answer 1

正如我（和其他人）所怀疑的那样，您使用字符串而不是数字似乎会产生问题。

用字符串进行计算是个坏主意，您可能会得到相当意外的行为（连接而不是加法...）。

我更改了 Worker 中的以下初始化

var idEnnemis = String(e.data[0]);
var recXEnn = String(e.data[1]);

xEnnemis = recXEnn;
var recSpeedEnn = String(e.data[2]);

...由

var idEnnemis = e.data[0];
var recXEnn = e.data[1];

xEnnemis = recXEnn;
var recSpeedEnn = e.data[2];

...事情似乎变得更好了。

Answer 2

太棒了，在更精确地查看了这条线之后

vitesseEnnemis[i] = Math.floor(Math.random() * (4 - 10 + 1) ) + 4;

我决定检查语法是否正确。 MDN link 此处拼写了正确的语法。我的代码应该是

而不是我的代码

vitesseEnnemis[i] = Math.floor(Math.random() * (4 - 1 + 1) ) + 1;

现在一切正常运行很好，我把问题当作已解决。

感谢您的帮助！

-= 和网络工作者的错误

Bug with -= and web workers

javascript

web-worker