在编译时纠正代码中的参数,错误的参数

时间:2017-09-04 23:22:31

标签: javascript html5-canvas

我今天玩得很开心。我正在开发一款我正在开发的游戏引擎。

这个问题解释起来有点复杂,它与javascript的工作方式有关,但请耐心等待。这是当前的代码:

'use strict';
//------------------- LOW LEVEL ENGINE DEFINITIONS ------------------------//
kd.A.down(function(){
	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i)
    	{
    		gameobjects[i].keydown_A(i);
    	})
})

kd.D.down(function(){
	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i)
    	{
    		gameobjects[i].keydown_D(i);
    	})
})

kd.W.down(function(){
	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i)
    	{
    		gameobjects[i].keydown_W(i);
    	})
})

kd.S.down(function(){
	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i)
    	{
    		gameobjects[i].keydown_S(i);
    	})
})

document.body.addEventListener('click', function(){
	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i){
		//var i=0; i<gameobjects.length; i++
		gameobjects[i].click_lm(i);
	})

	console.log(JSON.stringify(gameobjects))
}, true); 

var gameobjects=[];

var stdobj={
	x:0,
	y:0,
	id:0,
	create:function(){},
	destroy:function(){},
	step:function(){},
	keydown_A:function(){},
	keydown_D:function(){},
	keydown_W:function(){},
	keydown_S:function(){},
	click_lm:function(){},
	click_rm:function(){},
	draw:function(){}
};

var mpos={x:0,y:0}

$("body").mousemove(function(e) {
    mpos.x = e.pageX;
   	mpos.y = e.pageY;
})

var canvas = document.getElementById('canvas');
	if (canvas.getContext) 
	{
    	var ctx = canvas.getContext('2d');
    }

var main=function(){
	//instance_create(oRoomMng,0,0)

	drawscr();
}



function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}
window.onresize = function(event) {
resizeDiv();
}


function resizeDiv() {
	var vpw = $(window).width();
	var vph = $(window).height();


	var m=detectmob()

	if (m)
	{

	}
}

//------------------------------ MID LEVEL ENGINE -------------------------//
function drawscr(){
	ctx.clearRect(0, 0, 800, 800)

	kd.tick();

	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i)
	{
		gameobjects[i].draw(i);
	})

	if (gameobjects.length>0)
	gameobjects.forEach(function(o,i)
	{
		gameobjects[i].step(i);
	})

	requestAnimationFrame(drawscr);
}

$(document).ready(main)
$(document).ready(resizeDiv)

function lengthdir(dis, dir)
{
	var xspd=Math.cos(dir) * spd 
	var yspd=Math.sin(dir) * spd

	return {x:xp, y:yp}
}

function instance_create(obj,x,y)
{
	//console.log(JSON.stringify(obj));

	var l=gameobjects.length;
	gameobjects.push(obj)

	gameobjects[l].x=x
	gameobjects[l].y=y

	gameobjects[l].id=l

	gameobjects[l].create(l);

	return l;
}

function instance_destroy(id)
{
	gameobjects[id].destroy(id);

	gameobjects[id]=stdobj;
}

function dtr(inp)
{
	return ((inp*Math.PI)/180)
}

function angle_difference(x,y)
{
	x=dtr(x)
	y=dtr(y)
	var res=Math.atan2(Math.sin(x-y), Math.cos(x-y))
	res=res*180/Math.PI
	return res
}

function point_distance(x1,y1,x2,y2)
{
	return (Math.sqrt(Math.pow(x1-x2,2)+Math.pow(y1-y2,2)))
}

function point_direction(x1,y1,x2,y2)
{
	return (Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI);
}

function draw_sprite(sprite, x,y, angle)
{
	var ang=dtr(angle);

	var width = sprite.width;
	var height = sprite.height;

	ctx.translate(x, y);
	ctx.rotate(ang);
	ctx.drawImage(sprite, -width / 2, -height / 2, width, height);
	ctx.rotate(-ang);
	ctx.translate(-x, -y);
}
//--------------------- SPRITE DEFINITIONS ----------------------------------//
var sShip=new Image();
sShip.src="spr_ship.png"

//--------------------- OBJECT DEFINITIONS ----------------------------------//
//room manager object

var oBullet=stdobj;
oBullet.step=function(id){
	gameobjects[id].y-=10

	if (gameobjects[id].y<0)
	{
		instance_destroy(id)
	}
};

var oShip=stdobj
oShip.name="Ship"
oShip.create=function(id){
	gameobjects[id].xspd=0;
	//instance_create(oBullet,gameobjects[id].x,gameobjects[id].y)
};
oShip.step=function(id){
	if (Math.abs(gameobjects[id].xspd)>0)
	{
		gameobjects[id].x+=gameobjects[id].xspd
	}

	if (Math.abs(gameobjects[id].yspd)>0)
	{
		gameobjects[id].y+=gameobjects[id].yspd
	}

	gameobjects[id].xspd=gameobjects[id].xspd*.9;
	gameobjects[id].yspd=gameobjects[id].yspd*.9;
};
oShip.keydown_A=function(id){
	gameobjects[id].xspd=-5
};
oShip.keydown_D=function(id){
	gameobjects[id].xspd=5
};

oShip.keydown_W=function(id){
	gameobjects[id].yspd=-5
};
oShip.keydown_S=function(id){
	gameobjects[id].yspd=5
};
oShip.click_lm=function(id){
	console.log(JSON.stringify(oBullet))
	instance_create(oBullet,gameobjects[id].x,gameobjects[id].y)
}

oShip.draw=function(id){
	draw_sprite(sShip,gameobjects[id].x,gameobjects[id].y,0)
};



//create room manager... THE VERY LAST THING THAT HAPPENS OK!?!?
instance_create(oShip,400,700)

因此,当我尝试用空格发射子弹而不是创建子弹时,阵列游戏对象的所有元素都被太空船对象覆盖。

问题似乎来自oBullet创建(第209行),因为它的console.log立即返回不正确的项目符号对象。

这并没有解释为什么instance_create代码会覆盖所有游戏对象。

我无法弄清楚发生了什么,这让我疯狂。有人可以帮忙吗?

1 个答案:

答案 0 :(得分:0)

此代码:

var stdobj={
    x:0,
    y:0,
    id:0,
    create:function(){},
    destroy:function(){},
    step:function(){},
    keydown_A:function(){},
    keydown_D:function(){},
    keydown_W:function(){},
    keydown_S:function(){},
    click_lm:function(){},
    click_rm:function(){},
    draw:function(){}
};

从您的来源,创建一个对象,并为每个变量重复使用它。

该代码最简单的直接补丁是创建一个函数,EG:

function stdobj() {
    return { x:0, y:0, ... }
}

每次使用时都会调用stdobj(),而不仅仅是stdobj

这样,每次需要时都会创建一个新对象。