html - Getting image properties from Javascript Image() Element constructor -

i'm using new image(), preload images so:

function preload() {   var imgs = [];   (i = 0; < arguments.length; i++) {     imgs[i] = new image();     imgs[i].src = arguments[i];   } return imgs; }  //function being called var paths = ["../images/image01.jpg","../images/image02.jpg", ...]; var images = preload.apply(null, paths); 

this returns array of img objects... of properties emptied when displayed console.log()

my question - how can width , height of every preloaded image?

or more - possible in mysterious way dimensions earlier (some sort of pre-reading-pre-loaded-pre-image), create preloaded images particular size?

i'm sorry if don't understand obvious on "how these things works", happens me quite often.

just clarification

as @waterscroll pointed out, loading images takes time, getting image properties has done when .onload event occurs. later on, images can handled callback function.

feel free take @ other answers show more practical approach topic.

if may add - may beneficial in cases store image dimensions i.e. in database. in particular script i'm getting file paths database, size of image too.

after set src property takes while image load. in browsers, can use load event know when image has been loaded, in browsers don't support event can use complete property check if image has been loaded. once image has been loaded should able height , width of image via naturalheight , naturalwidth properties.

the way height , width of images without loading them saving information in place can reach script or inside script.