Question

下面的代码是我正在使用的代码，我正在尝试创建一个我打算在多个项目中使用的碰撞系统。但每次我尝试创建第二个实体来测试碰撞系统是否有效时，它只会返回以下错误。

ncaught TypeError：实体不是函数
在敌人（game.html：103）
在更新时（game.html：110）

代码段

<DOCTYPE html>
<html>
<canvas id="can" width="600" height="600" style="border:2px solid #000000"></canvas>
<script language "JavaScript">
var can = document.getElementById("can").getContext("2d");
can.font = '20px Arial';

var HEIGHT = 610;
var WIDTH = 610;

var startTime = Date.now();
var frames = 0;
var score = 0;


var entitylist = [];
var entity = function(id,type,x,y,xspd,yspd,width,height,color) {
    var self = {
    id:id,
    type:type,
    x:x,
    y:y,
    xspd:xspd,
    yspd:yspd,
    width:width,
    height:height,
    color:color
    };

    self.draw = function() {
        can.save();
        can.fillStyle = self.color;
        can.fillRect(self.x - self.width / 2,self.y - self.height / 2,self.width,self.height);
        can.restore();
    }
    self.position = function() {
        self.x = self.x + self.xspd;
        self.y = self.y + self.yspd

        if(self.x <= self.width-10) {
            self.x = self.width;
            self.xspd = -self.xspd;
            self.x = self.x + self.xspd;
        }
        if(self.x >= WIDTH - self.width) {
            self.x = WIDTH - self.width;
            self.xspd = -self.xspd;
            self.x = self.x + self.xspd;
        }
        if(self.y <= self.height-10) {
            self.y = self.height;
            self.yspd = -self.yspd;
            self.y = self.y + self.yspd;
        }
        if(self.y >= HEIGHT - self.height) {
            self.y = HEIGHT - self.height;
            self.yspd = -self.yspd;
            self.y = self.y + self.yspd;
        }

    }
    squareCollison = function(sqr1,sqr) {
        return sqr1.x <= sqr.x + sqr.width
            &&sqr.x <= sqr1.x + sqr1.width
            &&sqr1.y <= sqr.y + sqr.height
            &&sqr.y <= sqr1.y + sqr1.height;
    }
    collisonTest = function(sqr1,sqr) {
        var rect1 = {
        x:sqr1.x - sqr1.width / 2,
        y:sqr1.y - sqr1.height / 2,
        width:sqr1.width,
        height:sqr1.height
        }
        var rect2 = {
        x:sqr.x - sqr.width / 2,
        y:sqr.y - sqr.height / 2,
        width:sqr.width,
        height:sqr.height
        }
        return squareCollison(rect1,rect2);
    }
    self.update = function() {
        self.position();
        self.draw();
        console.log('entity update')
    }
    entity = self;
    entitylist[id] = self;
    return self;
}

enemy = function() {
    var id = Math.random();
    var type = 'enemy';
    var x = Math.random() * WIDTH;
    var y = Math.random() * HEIGHT;
    var xspd = 5 + Math.random() * 5;
    var yspd = 5 + Math.random() * 5;
    var width = 12 + Math.random()*10;  
    var height = 10 + Math.random()*10; 
    var color = 'red'
    entity(id,type,x,y,xspd,yspd,width,height,color);
}

updated = function() {
    can.clearRect(0,0,WIDTH,HEIGHT)
    frames++;
    if(frames % 50 === 0)
        enemy();
    for(E in entitylist){
        entitylist[E].update(entity);
        var collid = collisonTest(E,entitylist[E]);
        if(collid){
            console.log('colliding')
        }
    }
}
setInterval (updated,100);  
</script>
</html>

Answer 1

在entity函数结束时，您将其重新指定为self对象，这意味着在您第一次调用entity(...)后，它将不再是一个函数，并且将改为创建的第一个self对象。所以我认为只需删除entity = self;即可解决这个直接问题。

Javascript函数在第一次调用时工作，但从未在第二次或之后的任何其他时间工作

代码段

1 个答案: