html5-如何加载资源，在canvas上drawimage?

var ctx = mycanvas.getContext('2d');
var img = new image();
img.src=”1.png”;
ctx.drawImage(img);

var game = {};//游戏对象
game.imgResource = [
       {id: 'a1', src: 'image/1.jpg'},
    {id: 'a2', src: 'image/2.png'},
    {id: 'a3', src: ' image/3.png'}
];//游戏对象中的图片资源对象序列化
var source={};//资源对象
source.imgs = {};//开辟图片内存缓冲区
for(var i ==0;i<game.imgResource.length;i++){//开始资源预载
    source.loadImg(game.imgResource[i].id, game.imgResource[i].src);
}
source.loadImg = function(id, src) {//全部存入内存中
    source.imgs[id] = new Image();//开始存入内存中
    source.imgs[id].src = src;//指定资源路径
};