Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I have found that using prototypes is very helpful here. If you aren't familiar with them, prototypes are part of objects that allow you to set your own variables and/or methods to them.</p> <p>Doing something like:</p> <pre><code>Image.prototype.position = { x: 0, y: 0 } Image.prototype.onload = function(){ context.drawImage(this, this.position.x, this.position.y); } </code></pre> <p>allows you to set position and draw to the canvas without too much work.</p> <p>The "position" variable allows you to move it around on the canvas.<br> So it's possible to do:</p> <pre><code>var myImg = new Image(); myImg.position.x = 20; myImg.position.y = 200; myImg.src = "http://www.google.com/intl/en_ALL/images/logo.gif"; </code></pre> <p>and the image will automatically draw to the canvas at (20,200).</p> <p>Prototype works for all HTML and native Javascript objects. So</p> <pre><code>Array.prototype.sum = function(){ var _sum = 0.0; for (var i=0; i&lt;this.length; i++){ _sum += parseFloat(this[i]); } return _sum; } </code></pre> <p>gives a new function to all Arrays.</p> <p>However, </p> <pre><code>var Bob; Bob.Prototype.sayHi = function(){ alert("Hello there."); } </code></pre> <p>will not work (for multiple reasons, but i'll just talk about prototypes).<br> Prototype is a "property" of sorts, which contains all the your properties/methods that you input, and is already in each of the HTML and native Javascript objects (not the ones you make).<br> Prototypes also allow for easy calling (you can do "myImg.position.x" instead of "myImg.prototype.position.x" ).</p> <p>Besides, if you are defining you variable, you should do it more like this.</p> <pre><code>var Bob = function(){ this.sayHi = function(){ alert("Hello there."); } } </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

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