 |
BOOK: Professional JavaScript for Web Developers 2nd edition ISBN: 9780470227800
 | This is the forum to discuss the Wrox book Professional JavaScript for Web Developers, 2nd Edition by Nicholas C Zakas; ISBN: 9780470227800 |
|
Welcome to the p2p.wrox.com Forums.
You are currently viewing the BOOK: Professional JavaScript for Web Developers 2nd edition ISBN: 9780470227800 section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
|
|
|

February 24th, 2010, 01:15 AM
|
Registered User
|
|
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Subclassing dynamic prototype pattern
I'm trying to wrap my head around OO programming in general and more specifically as it applies to JS. The Professional Javascript for Web Developers book is pretty awesome and I feel I've learned a lot. However, this has me stumped. Hopefully what i'm trying to do is clear enough for someone to lend me a hand??
Code:
var Vehicle = function(options){
// Public Properties
this.wheels = options.wheels;
this.color = options.color;
this.engine = options.engine;
// Public Methods
if(typeof Vehicle._initialized == 'undefined'){
Vehicle.prototype.setWheels = function(wheels){
this.wheels = wheels;
};
Vehicle.prototype.setColor = function(color){
this.color = color;
};
Vehicle.prototype.setEngine = function(engine){
this.engine = engine;
};
Vehicle._initialized = true;
}
};
var Bike ={}
Bike.prototype = new Vehicle({wheels:2,engine:false});
window.onload = function(){
var myBike = new Bike({
color:'red'
});
alert(myBike.wheels);
};
|

February 25th, 2010, 01:42 PM
|
Registered User
|
|
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
Nobody has any thoughts? 
|

March 1st, 2010, 12:04 AM
|
 |
Wrox Author
|
|
Join Date: Dec 2004
Posts: 217
Thanks: 0
Thanked 5 Times in 5 Posts
|
|
I'd like to help, but pasting a bunch of code without any questions doesn't really tell me what information you're looking for. When asking for help in these forums, it's best to state 1) the background of what you're trying to do, 2) what you expected to happen when this code is run and 3) what's actually happening.
__________________
Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/
|

March 1st, 2010, 12:20 AM
|
Registered User
|
|
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
You're right, i apologize. I didn't explain myself well at all. I guess my issue is with prototype inheritance. I've done (very little) OO development in PHP and extending a class felt relatively straight forward as i remember (been a while). What i want to do is create a superclass, then create a few subclasses from that superclass to represent more specific instances of that object. Then i would usually create my objects from the subclasses and seldom, if ever, use the superclass. For example, i might have a Button() superclass that accepts basic settings like callback, name etc. Then subclasses like InputButton() or LinkButton() that inherit from Button() and apply more specific properties, such as the markup for the button element (<input/>,<a href/>) etc. I hope that makes a little more sense? ...and I hope i'm actually grasping what this whole OO thing is about and that I'm not way off base
Thanks for replying!
|

March 6th, 2010, 04:56 PM
|
 |
Wrox Author
|
|
Join Date: Dec 2004
Posts: 217
Thanks: 0
Thanked 5 Times in 5 Posts
|
|
You're right, inheritance in JavaScript isn't straightforward and is very different than any other language. I don't think one can explain in a forum post, which is why I wrote the book. :)
I'm afraid to say I'm still not sure how your question relates to the code you posted earlier. I can tell you that this:
Code:
var Bike = {};
Bike.prototype = new Vehicle({wheels:2,engine:false});
is probably not doing what you think it does. The prototype property only exists on functions, and Bike is an object.
__________________
Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/
|

March 6th, 2010, 07:09 PM
|
Friend of Wrox
|
|
Join Date: Dec 2008
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
|
|
javascript way
Below is one way to define super class and sub-class in javascript :
Code:
<html>
<head>
<script type="text/javascript">
function Vehicle() //super class
{
this.color = "some color";
this.wheel = "some number";
}
Bike.prototype = new Vehicle; //sub-class
function Bike()
{
this.wheel = 2;
this.speed = "some speed";
}
function showBike() {
bike = new Bike;
alert(bike.wheel);
alert(bike.color);
alert(bike.speed)
}
</script>
</head>
<body onload="showBike()">
</body>
</html>
Last edited by PeterPeiGuo; March 6th, 2010 at 07:12 PM..
|

March 7th, 2010, 02:40 AM
|
Registered User
|
|
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
@nzakas - sorry my example is so bad, eventually I'll get my head wrapped around this stuff :)
@PeterPeiGuo - Thank you for that example! I think that's what I'm looking for. I'll have to play with it a little to get a grip on how it's all working etc.
|

March 7th, 2010, 11:57 AM
|
Friend of Wrox
|
|
Join Date: Dec 2008
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
|
|
You are welcome. javascript is quite different in this sense.
|

March 7th, 2010, 05:25 PM
|
Registered User
|
|
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
@ PeterPeiGuo, i tried your example and it worked for me. Now i'm trying to take it a step further and i've already screwed things up again ;) I'm trying to use a namespace. is it not possible to namespace the subclass in this case?
Code:
<html>
<head>
<script type="text/javascript">
//<![CDATA[
var ABC = {};
ABC.Vehicle = function(){
this.color = "some color";
this.wheel = "some number";
};
ABC.Bike.prototype = new ABC.Vehicle;
ABC.Bike = function(){
this.wheel = 2;
this.speed = "some speed";
}
function showBike(){
var myBike = new ABC.Bike;
alert(myBike.wheel);
alert(myBike.color);
alert(myBike.speed)
}
//]]>
</script>
</head>
<body onload="showBike()">
</body>
</html>
|
|
 |