How to add object to built-in object in javascript?

Question

I'm trying to learn javascript from online tutorial. I don't understand line 12, what does these line of code do? what are outImage, thisImage.outImage, and Image()?Is Image() a javascript built-in object? Is thisImage.outImage an object? or only outImage is an object? Thanks so much, any answers are appreciated.! enter image description here

thisImage is the object passed to the function (in this case, an image) outImage is a new property being defined on the object. new Image(); is creating a new image. -- Really simple! — Niet the Dark Absol
– Niet the Dark Absol, Commented Feb 16, 2014 at 15:41
Checkout this question: Is there a specification for JavaScript Image object? — shawnzhu
– shawnzhu, Commented Feb 16, 2014 at 15:42
@Niet the Dark Absol, is Image() an object? is document.images[i] an object? — sopanha
– sopanha, Commented Feb 16, 2014 at 15:45
No, src is already a property of new Image() objects, so it's just setting an existing property to a new value ;) — Niet the Dark Absol
– Niet the Dark Absol, Commented Feb 16, 2014 at 16:15

LetterEh · Accepted Answer · 2014-02-16 16:49:46Z

1

Look at line 6.

setupRollover( document.images[i] );

That's calling the function.

function setupRollover (thisImg) { /* ... */ }

So thisImg === document.images[i];

document is a browser built-in object (not built into JavaScript, but one which is put in by every browser), which gives you access to the HTML on the page (aka: The "DOM").

so, document.images is a list of all of the images on the DOM.

var img = new Image( ); img.src = "..."; makes a new image, the same way typing <img src="..."> in the HTML gives you a new image.

The difference is that now you have it in JavaScript and not in HTML, so you can change it and move it around, and pass it to different functions.

The only other confusing piece of the puzzle is that you can attach almost anything to almost anything else in JavaScript.

var img = new Image(),
    img2 = new Image();

img.otherImage = img2;

This doesn't do anything special or magic.
It's just, now any time I ask for img.otherImage in that script, it will give me img2.

answered Feb 16, 2014 at 16:49

LetterEh

26.8k5 gold badges45 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

sopanha Over a year ago

in this code var img = new Image(), img is an object? how about Image(), is it an object or a class? thanks

LetterEh Over a year ago

There are no "classes" in JavaScript, yet. They're coming, eventually, though. Image is a constructor function, which returns a new instance of an image object. So it looks like a class. var img = new Image( ); so it is the function that makes image objects.

Collectives™ on Stack Overflow

How to add object to built-in object in javascript?

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related