/    Sign up×
Community /Pin to ProfileBookmark

storing functions in arrays and calling them…OO solution?

I’m trying to learn OO as it applies to Javascript and apply it to some of my bloated procedural libraries. I’m not sure i’m quite grasping it though. Here’s a simplified (for my benefit as much as yours) view of what i’m trying to do with a class for video player controls. Does this syntax even work?? Is there a better approach for this? I figured this would be more efficient than doing an if/else statement or switch statement for every control instance…I’m not a trained developer so if you take a stab at this make sure you leave out jargon and theory as much as possible or it will blow over my head at 30,000 ft ?

[code]
function Controls(iPluginType) {

this.pluginType=iPluginType; // 0-Windows Media, 1-RealPlayer, 2-QuickTime

this.playMovie=new Array(
/* function to play Windows Media movie */,
/* function to play RealPlayer movie */,
/* function to play QuickTime movie */
);

this.stopMovie=new Array(
/* function to stop Windows Media movie */,
/* function to stop RealPlayer movie */,
/* function to stop QuickTime movie */
);

if(typeof Controls.initialized==’undefined’){

Controls.prototype.play=function(){
this.playMovie[this.pluginType];
}

Controls.prototype.stop=function(){
this.stopMovie[this.pluginType];
}

Controls.initialized=true;
}
}[/code]

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@mrhooApr 20.2007 — You can't define the prototype inside the constructor- it doesn't exist yet.

And you shouldn't give every object you create all of the methods it does not need, but only the ones that it does, for the particular media player you are specifying.
Copy linkTweet thisAlerts:
@toicontienApr 20.2007 — Below is how this function should have been written:
function Controls(iPluginType) {

<i> </i>this.pluginType=iPluginType; // 0-Windows Media, 1-RealPlayer, 2-QuickTime

<i> </i>this.playMovie=[
<i> </i> /* function to play Windows Media movie */,
<i> </i> /* function to play RealPlayer movie */,
<i> </i> /* function to play QuickTime movie */
<i> </i>];

<i> </i>this.stopMovie=[
<i> </i> /* function to stop Windows Media movie */,
<i> </i> /* function to stop RealPlayer movie */,
<i> </i> /* function to stop QuickTime movie */
<i> </i>];

<i> </i>if(!this.initialized){

<i> </i> this.play=function(){
<i> </i> this.playMovie[this.pluginType];
<i> </i> }

<i> </i> this.stop=function(){
<i> </i> this.stopMovie[this.pluginType];
<i> </i> }

<i> </i> this.initialized=true;
<i> </i>}
}

The Controls function in this case is acting like a class constructor, or, the function that allows you to use this class. You have to create an instance of the Controls class before you can use it. Think of the Controls function as a template. It's not really usable until you use the template to create an object, and you'd do that like this:
var mymovie = new Controls(/* Function arguments here */);
Then you could use mymovie.play(); and it would play the movie for instance, by calling the play() member function.

You don't need to use "new Array". You can simply use [].
var myarray = new Array(); // Creates a new array with 0 items
var myotherarray = []; // Creates a new array with 0 items

Both pieces of code do the same thing, one is just less code and is a generally accepted "best practice."

Now if you want to add functions to the Controls class, you can do this:
function Controls() {
...
}

Controls.prototype.pause = function() {
// Do stuff
};
Copy linkTweet thisAlerts:
@bcamp1973authorApr 20.2007 — thanks toicontien! that helps me a lot. slowly starting to wrap my head around the world of OO development. going to be a slow process i think ?
×

Success!

Help @bcamp1973 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...