Javascript和画布问题

我的javascript有一个问题，当页面加载到这里是我的html和javascript时，我什么也不做。我被难住了，我不知道问题是什么（很抱歉我在iphone上这么做了）

index.php

    <canvas id="breakout" width="480" height="320"></canvas>

   <script>

    var canvas =  document.getElementById("breakout") ;
    var ctx = canvas.getContext("2d");


    var x = canvas.width/2;
    var y = canvas.height-30;
    var mx = 2;
    var my = -2;

    function checkCollision{
    if(y + my < 0){
    my = -my;
    }
    if(y + my > canvas.height){
    my = -my;
    }
    if(x + mx > canvas.width-ballRadius){
    mx = -mx;
    }
    if(x + mx < ballRadius){
    mx = -mx;
    }
    }

    function drawBall{
     var ballRadius = 10;
     ctx.beginPath();
     ctx.arc(x,y,ballRadius,0, Math.PI*2);
     ctx.fillStyle = "#0095DD";
     ctx.fill();
     ctx.closePath();
    }

    function drawing{
     ctx.clearRect(0,0,canvas.width,canvas.height);
     drawBall();
     x += mx;
     y += my;
     checkCollision();
      }

     setInterval(drawing,10);

    </script>

var canvas=document.getElementById（“breakout”）；
var ctx=canvas.getContext（“2d”）；
var x=canvas.width/2；
变量y=画布高度-30；
var-mx=2；
var my=-2；
函数检查冲突{
如果（y+my<0）{
my=-my；
}
如果（y+my>画布高度）{
my=-my；
}
如果（x+mx>画布宽度和半径）{
mx=-mx；
}
如果（x+mx

您没有正确定义函数。您需要这样定义函数：

function foo() {
    ...
}

做：

function foo{
    ...
}

无效，将导致控制台中出现错误。此外，由于许多函数中都使用了

ballRadius

，因此在函数

Draball

之外定义它：

var x = canvas.width/2;
var y = canvas.height-30;
var mx = 2;
var my = -2;
var ballRadius = 10; // Added

var canvas=document.getElementById（“breakout”）；
var ctx=canvas.getContext（“2d”）；
var x=canvas.width/2；
变量y=画布高度-30；
var-mx=2；
var my=-2；
var-ballRadius=10；
函数checkCollision（）{
如果（y+my<0）{
my=-my；
}
如果（y+my>画布高度）{
my=-my；
}
如果（x+mx>画布宽度和半径）{
mx=-mx；
}
如果（x+mx
谢谢我看了这么久，我看了最明显的thing@Jos使用类似linter的or可以帮助您在这些语法错误让您发疯之前快速发现它们（以及其他一些潜在的麻烦；-）