Javascript 帆布乒乓球比赛中球与桨的碰撞

球似乎从球拍的一侧反弹，但当球从一侧飞出时，球会在球拍中出现故障。我就是找不到背后的路，这真的很困扰我。我正在使用一些逻辑门来定义球的方向需要插入的位置

函数startName（）{
GameArea.start（）；
Ball1=新的圆形组件（“白色”，window.innerWidth-200，window.innerHeight-20）；
Ball1.y速度=13.5；
Ball1.x速度=6；
桨叶1=新的桨叶组件（87,83,0，窗内高度/2.5,10,70）；
桨叶2=新的桨叶组件（38,40，window.innerWidth-10，window.innerHeight/2.5,10,70）；
}
var游戏区={
canvas:canvas=document.querySelector（“canvas”），
开始：函数（）{
this.canvas.width=window.innerWidth；
this.canvas.height=window.innerHeight；
this.ctx=this.canvas.getContext（'2d'）；
this.interval=setInterval（updateGameArea，20）；
window.addEventListener（'keydown'，函数（e）{
GameArea.keys=（GameArea.keys | | |[]）；
GameArea.keys[e.keyCode]=true；
})
window.addEventListener（'keyup'，函数（e）{
GameArea.keys[e.keyCode]=false；
})
}, 
清除：函数（）{
this.ctx.clearRect（0，0，this.canvas.width，this.canvas.height）；
}
}
功能电路组件（颜色、x、y）{
这个.x=x；
这个。y=y；
这个宽度=8；
这个高度=8；
var context1=GameArea.ctx；
this.update=函数（）{
context1.beginPath（）；
context1.fillStyle=颜色；
context1.fillRect（this.x，this.y，this.width，this.height）；
context1.fill（）；
context1.stroke（）；
this.updatePosition（）；
}
this.updatePosition=函数（）{
这个.y+=这个.y速度；
this.x+=this.xSpeed；
if（this.x+this.width>GameArea.canvas.width）{
this.xSpeed=-this.xSpeed；
}
if（this.y+this.height>GameArea.canvas.height）{
this.ySpeed=-this.ySpeed；；
}
if（this.x-this.width<0）{
this.xSpeed=-this.xSpeed；
}	
if（this.y-this.height<0）{
this.ySpeed=-this.ySpeed；
}
如果（this.y+this.height>patle2.y&&this.y-this.width<（patle2.y+130）&&this.x+this.width>patle2.x）{
this.xSpeed=-this.xSpeed；
}	
如果（this.y+this.height>palle1.y和this.y-this.width<（palle1.y+70）和this.x-this.heightwindow.innerHeight）{
this.ySpeed=this.ySpeed-15；
}
if（（GameArea.keys&&GameArea.keys[Upkey]）&&this.y<0）{
this.ySpeed=this.ySpeed+15；
}
这个.y+=这个.y速度；
}
}
函数updateGameArea（）{
GameArea.clear（）；
1.update（）；
2.update（）；
Ball1.update（）；
}

帆布{
边框：0px纯黑；
背景色：黑色；
}
身体{
保证金：0；
溢出：隐藏；
}

无法直接看到您的代码出现了什么问题，所以我只是用ball对象中的ball、bat（Pable）测试函数重写了代码，并从players对象调用了该函数。球。棋盘（球员）；测试球是否击中球员的球棒。为了帮助描绘正在发生的事情，我放慢了速度，让蝙蝠成为现实。当球击中球棒时，它会变黄，球棒会变红一秒钟左右

你问到的部分有很多评论

希望能有帮助

从OP问题复制的演示

const设置={
速度：2，//球
左:0,，
宽度：400，
身高：200，
焊盘宽度：50，
焊盘高度：80，
焊盘速度：4，//双球
hitPauseCount:30，//发生碰撞时要保持的帧数
//可以检查一切是否正常
}
常量键={
阿罗普：错，
箭头向下：错误，
左箭头：假，
右箭头：错，
keyEvent（e）{//不要使用它已贬值的keyCode
if（键[e.code]！==未定义）{
键[e.code]=e.type==“keydown”；
e、 预防默认值（）；
}
}
}
var-ctx；
var ball1、桨1、桨2；
var游戏区={
开始（）{
canvas.width=setting.width；
canvas.height=setting.height；
ctx=canvas.getContext（'2d'）；
requestAnimationFrame（updateGameArea）；
},
清除（）{
clearRect（0，0，ctx.canvas.width，ctx.canvas.height）；
}
}
gameArea.start（）；
ball=新的圆形组件（“白色”，window.innerWidth-200，window.innerHeight-20）；
ball.y速度=设置速度；
ball.xSpeed=设置.speed；
拨杆1=新拨杆组件（“箭头向上”、“箭头向下”、setting.left、setting.height/2、setting.padWidth、setting.padHeight）；
拨杆2=新拨杆组件（“箭头左”、“箭头右”、setting.width-setting.padWidth、setting.height/2、setting.padWidth、setting.padHeight）；
window.addEventListener（'keydown'，keys.keyEvent）；
window.addEventListener（'keyup'，keys.keyEvent）；
功能电路组件（颜色、x、y）{
这个.x=x；
这个。y=y；
这个宽度=8；
这个高度=8；
this.xSpeed=设置.speed；
var-hit=0；
var重新计数；
var服务定向；
this.reset=函数（）{
this.x=ctx.canvas.width/2；
this.y=ctx.canvas.height/2；
this.xSpeed=-this.xSpeed
this.ySpeed=setting.speed*Math.sign（Math.random（）-0.5）；
重新计数=60；
}
this.draw=函数（）{