473,395 Members | 1,574 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

general prototype question

6
I'm trying to understand how the prototype property works, but there is one thing I donť get:
As far as I've got it, when I have one custom object with some methods and properties, all instances of this object point to its definition without copying (as the object was constructed with 'this'). To make it more clear what I mean (simplified):
Expand|Select|Wrap|Line Numbers
  1. // obj definition
  2. myObject  
  3. myObject.prototype.method
  4. myObject.prototype.property // this is probably clear, those are just variables
  5. // now instances:
  6. aa = myObject
  7. aa.method
  8. bb = myObject
  9. bb.method
  10. cc = myObject
  11. cc.method
Now assuming all of the instances point to the same method, is there a way to make them work independently? Again to make it more clear, let's say I have a timer object defined (with a prototype method for interval). I add two instances of the timer object to a page and I want them to work independently, just as they do not know of each other. It works okay when I use 'this' instead of prototype for the interval method, but when I use prototype, it seems to be broken (only the second instance counts). Is it because the both instances point to the same method and this feature just cannot be used this way? I could not find any relevant answer to this.

I also apologize, the question may be confusing and my english is not that good.
Thank you.
Jul 22 '08 #1
5 1258
gits
5,390 Expert Mod 4TB
the 'classical' way is the following:

Expand|Select|Wrap|Line Numbers
  1. function myObject() {
  2. }
  3.  
  4. myObject.prototype.method = function() {
  5.     // some code
  6. }
  7.  
  8. // new instance
  9. var o = new myObject;
  10. o.method();
  11.  
  12. var o_1 = new myObject;
  13. o_1.method();
so every instance is 'independent' from each other ... the way you used it just made references to the same object ...

kind regards
Jul 23 '08 #2
jirkap
6
the 'classical' way is the following: ...
Thanks for your reply. I wanted the 'code block' in the initial post to look more like a diagram, not an actual source code (apparently, that was a bad idea). I'll show you the whole code, as it might explain what I really want to know (commented, HTML excluded, there are probably some stupid things, as I learn, but it works):

Expand|Select|Wrap|Line Numbers
  1. function Timer(TimerInputID) { 
  2.     this.HH = '00'; 
  3.     this.MM = '00';
  4.     var HH = this.HH, MM = this.MM;
  5.     this.TimerInput = document.getElementById(TimerInputID).appendChild(document.createTextNode(HH + ':' + MM)); 
  6.  
  7.  
  8.     Timer.prototype.Start = function() { 
  9.     var that = this;
  10.         this.TimerRunning = setInterval(function() {that.count();}, 200);
  11.     };
  12.  
  13.     this.count = function() { // if I use Timer.prototype.count here, it becomes broken, when more than one instances of the Timer are used, why?
  14.         if (MM < 59) { MM++;     
  15.             if (MM < 10) { MM = '0' + MM; } else { MM; }
  16.         } else { MM = '00'; HH++;
  17.             if (HH < 10) { HH = '0' + HH; } else { HH; }
  18.         }
  19.         this.TimerInput.nodeValue = HH + ':' + MM;
  20.     };
  21.  
  22.     Timer.prototype.Stop = function() {
  23.         this.TimerRunning = clearInterval(this.TimerRunning); 
  24. }
  25.  
  26. // and there is a Timer.prototype.button, to Start/Stop the Timer, that works ok, it is meant to be used every time as an optional sub-object, as I might want to run the timer under other circumstances than clicking a button. So I guess there is no need to show that...
  27.  
  28. var aa = new Timer('timerInput');
  29. aa.ctrlButton('timerControl');
  30. var bb = new Timer('timerInput2');
  31. bb.ctrlButton('timerControl2');
I could probably leave it as it is and forget. But I would like to know why 'Timer.prototype.count' cannot be used that way instead of 'this.count'. It just does not make any sense to me.

Thanks for your patience :)
Jul 23 '08 #3
gits
5,390 Expert Mod 4TB
the problem is the setInterval where you just loose the execution context again ... you may fix that with:

[HTML]<html>

<script type="text/javascript">

function Timer(TimerInputID) {
this.HH = '00';
this.MM = '00';
this.TimerInput = document.getElementById(TimerInputID);

this.TimerInput.value = this.HH + ':' + this.MM;
}

Timer.prototype.start = function() {
var me = this;

var cb = function() {
me.count.call(me);
};

this.TimerRunning = setInterval(cb, 200);
}

Timer.prototype.count = function() {
if (this.MM < 59) {
this.MM++;

if (this.MM < 10) {
this.MM = '0' + this.MM;
} else {
this.MM;
}
} else {
this.MM = '00';
this.HH++;

if (this.HH < 10) {
this.HH = '0' + this.HH;
} else {
this.HH;
}
}

this.TimerInput.value = this.HH + ':' + this.MM;
}

Timer.prototype.stop = function() {
this.TimerRunning = clearInterval(this.TimerRunning);
}


function init() {
var aa = new Timer('timerInput');
aa.start();
}

function start_t2() {
var bb = new Timer('timerInput2');
bb.start();
}

</script>

<body onload="init();">
<input type="text" id="timerInput"/>
<input type="text" id="timerInput2"/>
<input type="button" value="start_t2" onclick="start_t2();"/>
</body>
</html>
[/HTML]
i just organized the code a little bit so when having a look at it you could trace a little bit better how it works. the call()-method calls the function with the correct execution-context ...

kind regards
Jul 23 '08 #4
jirkap
6
the problem is the setInterval where you just loose the execution context again ...
That's it! Thank you very much!
Jul 23 '08 #5
gits
5,390 Expert Mod 4TB
no problem ... post back to the forum anytime you have more questions :)

kind regards
Jul 23 '08 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

7
by: Florian Loitsch | last post by:
hi, in section 10.1.8 (Arguments Object) it is stated that the "internal ] property of the arguments object is the orginal Object prototype object, the one that is the *initial* value of...
4
by: lkrubner | last post by:
I'm reading an essay, I think one of Crockford's, and it has this example in it: function Demo() { } Demo.prototype = new Ancestor(); Demo.prototype.foo = function () { } ; Does Ancestor now...
21
by: Rob Somers | last post by:
Hey people, I read a good thread on here regarding the reason why we use function prototypes, and it answered most of my questions, but I wanted to double check on a couple of things, as I am...
105
by: Christoph Zwerschke | last post by:
Sometimes I find myself stumbling over Python issues which have to do with what I perceive as a lack of orthogonality. For instance, I just wanted to use the index() method on a tuple which does...
14
by: drM | last post by:
Hi Group, I am a little hesitant to ask this, after having read the "your question is less lively than a dead parrot answer!", but here goes. (Read thru the Faq, may have missed this, in which...
45
by: bigdadro | last post by:
I've created a new class using prototype.js. After I make the ajax.request all references to this.myClassMethodorVariable are lost. Does the ajax method blow out the object persistance? I'm fairly...
23
by: Dautkhanov | last post by:
Hello ! Does anybody have cutted version of prototype.js with the AJAX functionality only? I am a new in prototype.js topic, so I think this task should be done by other developers. Maybe...
3
by: kj | last post by:
OK, here's another construct I've run into in the jQuery source that I can't figure out. It looks like this: return new jQuery.prototype.init( selector, context ); So basically, as far as I...
83
by: liketofindoutwhy | last post by:
I am learning more and more Prototype and Script.aculo.us and got the Bungee book... and wonder if I should get some books on jQuery (jQuery in Action, and Learning jQuery) and start learning about...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.