Uncaught TypeError：未定義のp5.js/node.js/socket.ioのプロパティ 'copy'を読み取れません

Question

2番目のクライアントが接続されているときにエラーが発生しています。私のコードは、2つのクライアントの現在の位置をp5.Vector.dist（）で比較しています。ここにはエラーがあります。

とp5.Vector.dist（p5.js：25914）で行これは私のコードです

p5.Vector.prototype.dist = function (v) { 
 
    var d = v.copy().sub(this); //This is the exact line where the error says from 
 
    return d.mag(); 
 
};

です。

クライアント側。

//I use for loop to see all the contain of otherCircles 
 
for(var x = 0; x < otherCircles.length; x++){ 
 
\t \t if(otherCircles[x].id != socket.id){ //To make sure i won't compare the client's data to its own because the data of all connected client's is here 
 
\t \t \t console.log(otherCircles[x].radius); //To see if the data is not null 
 
\t \t \t if(circle.eat(otherCircles[x])){ 
 
\t \t \t \t if(circle.radius * 0.95 >= otherCircles[x].radius){ 
 
\t \t \t \t \t otherCircles.splice(x,1); 
 
\t \t \t \t \t console.log('ATE'); 
 
\t \t \t \t } else if(circle.radius <= otherCircles[x].radius * 0.95){ 
 
\t \t \t \t \t zxc = circle.radius; 
 
\t \t \t \t \t asd = zxc; 
 
\t \t \t \t \t circle.radius = null; 
 
\t \t \t \t \t console.log('EATEN'); 
 
\t \t \t \t } 
 
\t \t \t } 
 
\t \t } 
 
\t } 
 

 
//Here's the eat function of the circle 
 

 
function Circle(positionX,positionY,radius){ 
 
//The variables of Circle() 
 
     this.position = createVector(positionX, positionY); 
 
\t this.radius = radius; 
 
\t this.velocity = createVector(0, 0); 
 
    
 
    //Here's the eat function 
 
    this.eat = function(other) { 
 
     var distance = p5.Vector.dist(this.position, other.position); //Heres where the error 
 
     if (distance < this.radius + (other.radius * 0.25)) { //Compare there distance 
 
     return true; 
 
     } else { 
 
     return false; 
 
     } 
 
    } 
 
}

otherCircles []に含まれます。

そして、それはまた、ラインはconsole.log（otherCircles [X] .radius）の出力です。。

私は、クライアントの現在の位置とサイズを受け取り、他のクライアントの位置とサイズを送信するだけなので、サーバー側は必要ではないと思います。 otherCircles（）に格納されているすべてのデータ。行console.log（otherCircles [x] .radius）;結果がnullではないので、私はクライアントの位置と比較しているデータがあることを知っています。なぜこのようなエラーが発生していますか？

Answer 1

MCVEがなければあなたを助けるのはかなり難しいでしょうが、私はこれをデバッグすることをお手伝いします。

otherCircles[x].radiusが印刷されました。これは適切なスタートです。しかし、もし私があなただったら、otherCircles[x]についてもっと知りたいです。どの変数と関数に含まれていますか？まず「オブジェクトのJavaScriptプリント関数名」を検索し、そのオブジェクトに含まれるものを正確に把握しようとします。 otherCircles[x].positionの値は何ですか？

そこから、otherCircles[x].positionが定義され、p5.Vectorのインスタンスも確実に作成したいと思います。それはcopy()機能を持っていますか？

また、デバッガを使用してコードをステップバイステップで実行することもできます。すべてのブラウザには1つのコードが用意されています。

まだ動作しない場合は、MCVEをコピーして貼り付けることで実行できるMCVEを投稿してください。つまり、サーバーコードがないことを意味し、値をハードコードするだけで、同じエラーが表示されます。私はあなたが小さな例に絞ろうとしている間にあなたの問題を見つけるだろうと思う。しかし、そうでなければ、我々はそこから行くでしょう。がんばろう。