关于这个时钟代码里面有几处不明白的地方，望各位大神指点指点。

Question

var canvas=document.getElementById('canvas'),
                ctx=canvas.getContext('2d'),
                FONT_HEIGHT=15,                                             //字体高度
                MARGIN=35,                                                      //边缘
                HAND_TRUNCATION=canvas.width/25,                
                HOUR_HAND_TRUNCATION=canvas.width/10,
                NUMERAL_SPACING=20,                                     
                RADIUS=canvas.width/2-MARGIN,                       
                HAND_RADIUS=RADIUS+NUMERAL_SPACING;

function drawCircle(){
                        ctx.beginPath();
                        ctx.arc(canvas.width/2,canvas.height/2,RADIUS,0,Math.PI*2,true);
                        ctx.stroke();
}                                                       //画出时钟的圆框轮廓
function drawNumerals(){ctx.beginPath();
                        ctx.arc(canvas.width/2,canvas.height/2,RADIUS,0,Math.PI*2,true);
                        ctx.stroke();
    var numerals=[1,2,3,4,5,6,7,8,9,10,11,12],
    angle=0,
    numeralWidth=0;

    numerals.forEach(function(numeral){
                            angle=Math.PI/6*(numeral-3);  
                            numeralWidth=ctx.measureText(numeral).width;
                            ctx.fillText(numeral,canvas.width/2+Math.cos(angle)*(HAND_RADIUS)-numeralWidth/2,
                            canvas.height/2+Math.sin(angle)*(HAND_RADIUS)+FONT_HEIGHT/3);
    });
}                                                       //画出时钟的12小时刻度
function drawCenter(){
    ctx.beginPath();
    ctx.arc(canvas.width/2,canvas.height/2,5,0,Math.PI*2,true);
    ctx.fill();
}                                                       //时钟盘心得实心圆点绘画

function drawHand(loc,isHour){
    var angle=(Math.PI*2)*(loc/60)-Math.PI/2,
            handRadius=isHour?RADIUS-HAND_TRUNCATION-HOUR_HAND_TRUNCATION:RADIUS-HAND_TRUNCATION;

            ctx.moveTo(canvas.width/2,canvas.height/2);
            ctx.lineTo(canvas.width/2+Math.cos(angle)*handRadius,
                            canvas.height/2+Math.sin(angle)*handRadius);
                            ctx.stroke();
}
function drawHands(){
    var date=new Date,
            hour=date.getHours();

            hour=hour>12?hour-12:hour; 

            drawHand(hour*5+(date.getMinutes()/60)*5,true,0.5);
            drawHand(date.getMinutes(),false,0.5);
            drawHand(date.getSeconds(),false,0.2);
}                                                                       //指针移动绘画
function drawClock(){
        drawCircle();
        drawCenter();
        drawHands();
        drawNumerals();
}
ctx.font=FONT_HEIGHT+'ps Arial';

loop=setInterval(function(){
ctx.clearRect(0,0,canvas.width,canvas.height);
drawClock();
},1000);

在function drawNumerals(){
.........
}这段函数里面，var numerals=[1,2,3,4,5,6,7,8,9,10,11,12],
angle=0,
numeralWidth=0;
第一个是定义的是数组，第二个起始弧度，第三个要定义数组宽度干嘛？

在数组遍历中numerals.forEach(function(numeral){
angle=Math.PI/6*(numeral-3);
numeralWidth=ctx.measureText(numeral).width;
ctx.fillText(numeral,canvas.width/2+Math.cos(aangle)*(HAND_RADIUS)-numeralWidth/2,
canvas.height/2+Math.sin(angle)*(HAND_RADIUS)+FONT_HEIGHT/3);
});
angle=Math.PI/6*(numeral-3);他这个算法是什么意思？
ctx.fillText(numeral,canvas.width/2+Math.cos(aangle)*(HAND_RADIUS)-numeralWidth/2,
canvas.height/2+Math.sin(angle)*(HAND_RADIUS)+FONT_HEIGHT/3);
这段算法是什么意思？

两段function drawHand(loc,isHour){
。。。。。。
}
function drawHand(){
........
}
函数也看不太懂。

最后ctx.font=FONT_HEIGHT+"ps Arial";这是设置那里的字体？

setInterval();我记得已经是循环了，为什么还要加loop=setInterval();
这是什么意思？以上这些不明白的地方希望有大神指点，因为是新手，有些地方可能问的不是太彻底，忘谅解。