Why does my debugg system on the webbrowser tell me (drawImage is not a function)?

Question

I am making a JavaScript program while I tried to draw an image. I just searched on Google how to do it and multiply sources told me the same:

ctx.drawImage(images[0],100,100);

I tried to do this so, I made an array and putted in a image in their and then a src and tried to draw the image but my Firefox debugger tells me "drawImage is not a function".

This is my code:

var images = new Array();
canvas = document.getElementById('canvas');
images[0] = new Image();
images[0].src=("img/w1.png");
ctx.drawImage(images[0],100,100);

BTW this works on the program :

ctx[1].fillStyle = "#000000";
ctx[1].fillRect(x[0], y[0], 50, 50);

Answer 1

Once you define your ctx right it should work.

var images = new Array();
canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
images[0] = new Image();
images[0].src=("img/w1.png");
ctx.drawImage(images[0],100,100);