The problem you are having is usually referred to as collision detection.
The most common approach to collision detection is to abstract each object as a geometrical shape and then check if these shapes intersect. Common choices are either rectangles or circles, because checking these for intersection with each other is rather trivial.
Another approach is to use pixel-based collision detection. You draw the two objects you want to check on separate layers, and then you check the color-value of each pixels on both layers. When the alpha-values of both are > 0, you have a collision. The advantage is that it is very accurate, but the disadvantage is that it is quite CPU intense because you need to check so many pixels. To optimize the CPU load, you can combine it with the geometric method to reduce the amounts of pixels you need to check.
- define a rectangle around each object
- check if the rectangles intersect
- when they do calculate the intersecting area
- draw both objects to separate, empty, canvases
- get the pixel-data of the areas on both canvases with
context.getImageData()
- Compare the alpha-value of the returned arrays. When the same pixel on both canvases is greater than 0, you have a collision.