StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POObject Oriented Javascript Prototype, Access Root Variables?
text
Body
copied!<p>Lets get into it. I've created a working "Inertial Camera" in Javascript, and while I'm very experienced in Javascript, I'm not experienced with prototyping in JS. I'm attempting to restructure my camera as follows, with the initial function constructor:</p> <pre><code> function Inertia(subject, clickable) { this.subject = document.getElementById(subject); this.clickable = document.getElementById(clickable); } </code></pre> <p>And the prototype:</p> <pre><code> Inertia.prototype = { subject : document.getElementById(''), clickable : document.getElementById(''), camera : { angleX : 85, angleY : 0, angleZ : 0, translateX : 0, translateY : -100, depth : 0, flag : 1 }, mouse : { x : 0, y : 0 }, friction : 1, inertia : true, mouseEvents : { mouseDown : function( e ) { var IS = this; // This will not work because I am two levels away from "this" being my object. // cancel existing animation clearTimeout((window).animation); (IS).mouse.x = e.clientX; (IS).mouse.y = e.clientY; (IS).camera.flag = 0; // begin logging history to animate from as a new history stack (IS).tools.pushHistory('reset'); }, </code></pre> <p>... continued ...</p> <p>My problem is that within my prototype object, I cannot access the root level elements such as <code>mouse.x</code> or <code>mouse.y</code>. What is the best method to access these elements for this specific instance of my "Inertia" class when creating a prototype like this? Is this the completely wrong idea?</p> <p>I'm looking to understand the proper implementation of a prototype in this manner. I've looked up tutorials and articles on prototyping, and I've yet to see any examples address this nesting issue. They all use one level deep in their prototype so calling <code>this</code> is not problem.</p> <p>I am attempting to have <code>var IS</code> equal the current object, so that in every instance of this inertial camera I will alter only that specific object. However, I am two levels deep within my prototype, so <code>this</code> keyword will not work. I could hardcode it equal to the variable name if I have only one instance of <code>new Inertia()</code>, but that is obviously not desirable.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload