setInterval()setTimeout()requestAnimationFrame()clearInterval()clearTimeout()cancelAnimationFrame()

var canvas =wx.createCanvas()var ctx =canvas.getContext("2d")ctx.fillStyle ="red"ctx.fillRect(0,0,100,100)ctx.clearRect(0,0,canvas.width,canvas.height)  //清除画布ctx.fillRect(0,20,100,100)ctx.clearRect(0,0,canvas.width,canvas.height)ctx.fillRect(0,150,100,100)var num =0var timer=setInterval(function(){    num++    ctx.clearRect(0,0,canvas.width,canvas.height)    ctx.fillRect(0,num++,100,100)    if(num150){        clearInterval(timer)    }},20)

//用延时器做动画var canvas =wx.createCanvas()var ctx =canvas.getContext("2d") ctx.fillStyle ="red"//延迟定时器去做ctx.fillRect(0,0,100,100)setTimeout(() = {    ctx.clearRect(0,0,canvas.width,canvas.height)      ctx.fillRect(0,150,100,100)}, 500);

var canvas =wx.createCanvas()var ctx =canvas.getContext("2d") ctx.fillStyle ="red"VAR TIMER =NULL//延迟定时器去做ctx.fillRect(0,0,100,100)var num =0;loop()function loop(){    num ++    TIMER= setTimeout(() = {        ctx.clearRect(0,0,canvas.width,canvas.height)          ctx.fillRect(0,num,100,100)        if(num150){           clearTimeout(TIMER)        }            }, 20);}

var canvas = wx.createCanvas();var ctx = canvas.getContext("2d");ctx.fillStyle = "red";//requestAnimationFramevar num = 0loop()function loop(){    num++    requestAnimationFrame(function(){            ctx.clearRect(0,0,canvas.width,canvas.height)            ctx.fillRect(0,num,100,100)            loop()    })}

//碰撞检测var canvas = wx.createCanvas();var ctx = canvas.getContext("2d");var img = wx.createImage();var firstX = 0;var firstY = 0;var imgW = 100;var imgH = 100;var isShow = false;img.src = "./source/2.jpg";img.onload = function() {  ctx.drawImage(img, firstX, firstY, imgW, imgH);};wx.onTouchStart(function(e) {  var touch = e.changedTouches[0];  var clientX = touch.clientX;  var clienty = touch.clientY;  if (    firstX  clientX &&    clientX  firstX + imgW &&    (firstY  clienty && clienty  firstY + imgH)  ) {    isShow = true;  }});wx.onTouchMove(function(e) {  if (isShow) {    ctx.clearRect(0, 0, canvas.width, canvas.height); //清除画布    var touch = e.changedTouches[0];    var clientX = touch.clientX;    var clienty = touch.clientY;    if((clientX-imgW/2)0){        firstX =0    }else if((clientX-imgW/2)(canvas.width-imgW)){        firstX = canvas.width-imgW    }else{        firstX = clientX-imgW/2    }    if((clienty-imgH/2)0){        firstY =0    }else if((clienty-imgH/2)(canvas.height-imgH)){        firstY =(canvas.height-imgH)    }else{        firstY = clienty-imgH/2    }    ctx.drawImage(img,firstX,firstY,imgW,imgH);  }});wx.onTouchEnd(function(){    isShow = false})