Wrox Programmer Forums
|
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
 
Old February 24th, 2010, 01:15 AM
Registered User
 
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
Default 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);
};
 
Old February 25th, 2010, 01:42 PM
Registered User
 
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
Unhappy

Nobody has any thoughts?
 
Old March 1st, 2010, 12:04 AM
nzakas's Avatar
Wrox Author
 
Join Date: Dec 2004
Posts: 217
Thanks: 0
Thanked 5 Times in 5 Posts
Default

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/
 
Old March 1st, 2010, 12:20 AM
Registered User
 
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
Default

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!
 
Old March 6th, 2010, 04:56 PM
nzakas's Avatar
Wrox Author
 
Join Date: Dec 2004
Posts: 217
Thanks: 0
Thanked 5 Times in 5 Posts
Default

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/
 
Old March 6th, 2010, 07:09 PM
Friend of Wrox
 
Join Date: Dec 2008
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
Default 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..
 
Old March 7th, 2010, 02:40 AM
Registered User
 
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
Default

@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.
 
Old March 7th, 2010, 11:57 AM
Friend of Wrox
 
Join Date: Dec 2008
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
Default

You are welcome. javascript is quite different in this sense.
 
Old March 7th, 2010, 05:25 PM
Registered User
 
Join Date: May 2006
Posts: 7
Thanks: 0
Thanked 0 Times in 0 Posts
Default

@ 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>





Similar Threads
Thread Thread Starter Forum Replies Last Post
DirectoryInfo.GetFiles(pattern): search pattern fo arif_1947 VS.NET 2002/2003 1 October 19th, 2004 11:59 PM
Subclassing...Help Please! gede Pro VB 6 1 March 29th, 2004 09:53 AM
Adding prototype functions AgentSmith Javascript How-To 1 July 20th, 2003 09:41 AM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.