2017-09-17 6 views
0

問題があります。 Candy関数のオブジェクトを作成しようとすると、すべての属性がうまく作成されているようです。しかし、draw関数を実行しようとするたびに、私が使っているオブジェクトの代わりに、最新のオブジェクトのすべてのプロパティが使用されます。それは、私が2度作成した2番目のオブジェクトを常に描画しますが、最初のオブジェクトは描画しません。なぜ私は考えていない。私はこれを修正しようとするためにすべてを試したので、このコードで何か非常に非効率的であるように見える場合、おそらくこれを修正しようとする私の多くの試みの1つでした。あなたは問題を知っていますか?ここでJavascript - オブジェクト内の関数内のプロパティが、最新のオブジェクトに戻す

はキャンディ関数のコードです:ここで

Candy = function(img, location, canvas) { 
 
\t self = {} 
 
\t self.image = new Image() 
 
\t self.image.src = img 
 
\t self.location = {x: location.x, y: location.y} 
 
\t self.canvas = canvas 
 
\t self.draw = function() { 
 
\t \t self.canvas.drawImage(self.image, self.location.x, self.location.y, 132.4, 132.4) 
 
\t } 
 
\t self.move = function(FPS, seconds, location) { 
 
\t \t frames = FPS * seconds 
 
\t \t deltaX = (location.x - self.location.x)/frames 
 
\t \t deltaY = (location.y - self.location.y)/frames 
 
\t \t counter = 0 
 
\t \t setInterval(function() { 
 
\t \t \t self.location.x += deltaX 
 
\t \t \t self.location.y += deltaY 
 
\t \t \t counter++ 
 
\t \t \t self.draw() 
 
\t \t \t if(counter >= frames) 
 
\t \t \t \t clearInterval() 
 
\t \t }, 1000/FPS) 
 
\t } 
 
\t self.image.onload = function() { 
 
\t \t Candy.list.push(self) 
 
\t \t Candy.queue.splice(0, 1) 
 
\t \t 
 
\t \t if(Candy.queue.length == 0) 
 
\t \t \t draw() 
 
\t \t else 
 
\t \t \t Candy(Candy.queue[0].img, Candy.queue[0].location, Candy.queue[0].canvas) 
 
\t } 
 
} 
 
Candy.list = [] 
 
Candy.queue = []

私はキャンディ関数を呼び出すところである:

gameStarted = true 
 
\t Candy.queue.push({img: "client/img/candy.png", location: {x: width/3 - 87.5, y: height/10}, canvas: canvasContext}) 
 
\t Candy.queue.push({img: "client/img/candy2.png", location: {x: width/3 - 87.5, y: 3 * (height/10)}, canvas: canvasContext}) 
 
\t 
 
\t Candy(Candy.queue[0].img, Candy.queue[0].location, Candy.queue[0].canvas)

最後に、ここでの描画機能は次のとおりです。

function draw() { 
 
\t colorRect(0, 0, canvas.width, canvas.height, 'white'); 
 
\t colorText("Player 1", 0.02, 0.05, "black", "40px Comic Sans"); 
 
\t colorText("Player 2", 0.88, 0.05, "black", "40px Comic Sans"); 
 
\t 
 
\t if(!gameStarted) { 
 
\t \t if(player1.ready) 
 
\t \t \t colorText("Ready", 0.02, 0.09, "green", "20px Comic Sans"); 
 
\t \t else 
 
\t \t \t colorText("Not Ready", 0.02, 0.09, "red", "20px Comic Sans"); 
 
\t \t if(player2.ready) 
 
\t \t \t colorText("Ready", 0.88, 0.09, "green", "20px Comic Sans"); 
 
\t \t else 
 
\t \t \t colorText("Not Ready", 0.88, 0.09, "red", "20px Comic Sans"); 
 
\t \t if(player1.ready && player2.ready) 
 
\t \t \t colorText("Press a button to start the game!", 0.32, 0.5, "black", "40px Comic Sans") 
 
\t }else{ 
 
\t \t alert(Candy.list[0].image.src) 
 
\t \t alert(Candy.list[0].getImg()) 
 
\t \t for(var i = 0; i < Candy.list.length; i++) { 
 
\t \t \t Candy.list[i].draw() 
 
\t \t } 
 
\t \t //TODO 
 
\t } 
 
}

+0

あなたは 'Candy.prototype'に' self'のプロパティ( 'this''、すでに問題を分かっているので)の' move'と 'draw'をプロパティから移動することを検討するべきです。そうすれば、すべてのキャンディは、それらの機能のコピーを持つよりも、参照を共有することになります。 –

答えて

0

さてさて、私はそれを考え出しました。関数では、私はこれで自己を置き換え、問題を修正しました。何の返信も必要ありません。

関連する問題