我们可以在 JavaScript 的自定义 function 中使用预定义的 function 吗？

Question

 //making custom function for a fish
 drawFish=function  (centerX,centerY){
 //using draw function for animation
 draw=function(){
 var bodyLength = 115;
 var bodyHeight = 74;
 var bodyColor = color(162, 0, 255);

 noStroke();

 fill(bodyColor);

  // body
 ellipse(centerX, centerY, bodyLength, bodyHeight);

 // tail

 var tailWidth = bodyLength/4;

 var tailHeight = bodyHeight/2;

 triangle(centerX-bodyLength/2, centerY,

 centerX-bodyLength/2-tailWidth, centerY-tailHeight,

 centerX-bodyLength/2-tailWidth, centerY+tailHeight);

 // eye

 fill(33, 33, 33);

 ellipse(centerX+bodyLength/4, centerY, bodyHeight/5, bodyHeight/5);

 centerX++;

 };


 };     
 //calling custom function
 drawFish(146,208);
 drawFish(207,212);
 drawFish(305,306);
 drawFish(114,309);
 drawFish(300,100);

我正在尝试在水平移动的坦克中制作一个简单的 animation 5 条鱼。 我为一条鱼编写了代码，然后我将其定制为 function，这样我就可以随意调用它多次。 然后我为 animation 放置draw =function(){}来移动鱼。 这段代码一直有效，直到我将draw() function 放入其中，否则只剩下一条鱼，其他鱼消失。 我们如何使用绘图 function 在此自定义 function 中制作 animation 以便它适用于每条鱼。

Answer 1

您可以尝试使用运算符new 。 我不完全确定它是否会按照您的编码方式工作，但您可以执行以下操作：

 function drawFish(centerX, centerY) { this.centerX = centerX; this.centerY = centerY; // draw your fish here using centerX and centerY as it's X and Y } var fish = new drawFish(0,0); var fish1 = new drawFish(50,50); function Loop() { fish.centerX++; fish.centerY++; fish1.centerX++; fish1.centerY++; console.log('Fish position:', fish.centerX, fish.centerY) console.log('Fish1 position:',fish1.centerX, fish1.centerY); } setInterval(Loop, 500)