Js oop

BlackScorp · 12.05.2011, 15:00

Hey leute,

ich habe mich etwas in OOP in JS eingelesen und habe folgende codes gefunden

PHP-Code:

  var Foo = function(){

 
this._privateMethod = function(){

//mach was

}

 
this.publicMethod = function(){

//mach was anderes

}

}

und das hier

PHP-Code:

  var Foo = function(){}

 
Foo.prototype._privateMethod = function(){

 
}

 
Foo.prototype.publicMethod = function(){

 
}

nun wollte ich fragen, wo der unterschied zwischen den beiden varianten ist und welchen man eher nutzen sollte und wieso.

hoffe ihr könnt mir hier das erklären

MFG

ChrisB · 12.05.2011, 15:09

Fang mal hier an: http://molily.de/js/organisation-instanzen.html

Auch die weiteren JS-Artikel von dort sind sehr gut.

mepeisen · 12.05.2011, 15:10

Die Funktion in Foo ist gewissermaßen der Konstruktor. Generell sind die Funktionen der Klasse "Foo" sozusagen dynamisch. Beim Anlegen eines Objektes werden sozusagen die Funktionsreferenzen in das Objekt kopiert und können später überschrieben werden. Beispiel:

PHP-Code:

  var Foo = function() {
  this.myfunc = function() { alert('MyFunc'); };
};
var FooObject = new Foo();
var FooObject2 = new Foo();
FooObject.myfunc();
FooObject2.myfunc();
FooObject.myfunc = function() { alert('OtherFunc'); };
FooObject.myfunc();
FooObject2.myfunc();

Probiere das mal aus.

Private Methoden reinzutun ist extrem schlechter Stil. Javascript kennt weder Vererbung noch private oder protected. Wenn man wirklich geschützte Methoden reintun will, geht beispielsweise folgendes Hilfskonstrukt:

PHP-Code:

  var Foo = function(){

  var me = this;

  var private1 = function() {
    me.public2();
  };

  me.public1 = function() {
    private1();
  };

  me.public2 = function() {
    alert('Hello World');
  };
};

Was ist der Unterschied? "private1" lebt nur innerhalb des Konstruktors und auch nur durch Closures innerhalb der Methoden. Von außen lässt sich private1 weder aufrufen noch überschreiben.

Es gibt diverse Frameworks, die über ein paar Tricks auch echte Vererbung ermöglichen. Beispielsweise ExtJS/Sencha.

nikosch · 12.05.2011, 15:16

Mal sehen, ob ich das zusammenbekomme.

1. Prototypen-Methoden wirken allgemein (ähnlich wie in PHP-Klassen), wären this.methode()-Methoden an die jeweilige Objektinstanz gebunden werden. Sie werden also für jede Instanz neu „erstellt“ und zugewiesen und verbrauchen damit mehr Speicher. Stell Dir sowas vor:

PHP-Code:

  var Foo = function(a){

  if (a) {
    this._privateMethod = function(){
    //mach was
    };

    this.publicMethod = function(){
    //mach was anderes
    };
  }
  else {
    this._privateMethod = function(){
    //mach was anderes
    };
  } 
}

- ist durchaus möglich in Javascript.

2. Prototypen-Methoden kennen this nicht. Du kannst dort mit Variablen wie Foo.myVar arbeiten, aber this ist zum Zeitpunkt der Methodenzuweisung noch nicht existent (entsteht erst bei new Object

BlackScorp · 12.05.2011, 15:28

also um das ganze mal zusammen zu fassen.. die erste von mir aufgeschriebene möglichkeit sollte man nutzen und prototypen sind ledeglich dazu da um neue methoden einer instanz hinzuzufügen bzw zu überschreiben..
habe ich das richtig verstanden? also sollte man prototype nicht nutzen oder?

bezüglich private und public.. im netbeans werden alle methoden die mit einem

this._ anfangen als private dargestellt und ohne _ als public ich kriege auch bei quellcode vervollständigung keine methode zu sehen die mit _ anfängt

sprich

PHP-Code:

  var Foo = function(){

this._bar = function(){

alert("bar");

}

 
this.bar2 = function(){

alert("bar2");

}

}

 
var foo1 = new Foo();

 
foo1._bar();// geht nicht

foo1.bar2(); //geht..

also geht ja private und public in JS ... theoretisch

mepeisen · 12.05.2011, 15:45

Das mit dem Unterstrich ist lediglich eine Konventionen. Technisch werden die nicht private. Du kannst problemlos die mit Unterstrich aufrufen, egal was NetBeans da beim Code-Vervollständigen treibt.

rudygotya · 12.05.2011, 15:46

Natürlich kannst du funktional wie oben beschrieben vererben. Alternativ singleton definieren und per Object.create vererben (achtung: ecma5).

Dazu gibts auch sehr viele spannende „pseudoklassische“ Vererbungen, hier paar bekannte Vertreter:

MooTools Class (leider verändern die den prototype nativer typen... )
Base.js (dean edwards)
Prototype.js Class (siehe mootools)
jQueryui widget core

Googlen, lesen, lesen, lesen und selbst ausprobieren, was dir am besten gefällt

Grüße

Basti

nikosch · 12.05.2011, 15:48

Zitat:

und prototypen sind ledeglich dazu da um neue methoden einer instanz hinzuzufügen bzw zu überschreiben..
habe ich das richtig verstanden?

Nein.

Zitat:

also sollte man prototype nicht nutzen oder?

Doch.

Prototypen spielen eine wichtige Rolle bei der Vererbung. Weitere Vorteile habe ich oben beschrieben.

http://developer.yahoo.com/yui/theater/
In
„Douglas Crockford — The JavaScript Programming Language“ oder
„Douglas Crockford — Advanced JavaScript“

wird das Prototyping-Konzept gut erklärt. Frag mich jetzt nicht wo.

rudygotya · 12.05.2011, 16:18

Ahja, hier noch ein super Nachschlagewerk: javascript garden

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Website in OOP: Wie am besten vorgehen?	GreenDelta	PHP Einsteiger	13	29.01.2011 12:25
[Erledigt] OOP - Klassen richtig Designen, aber wie?	Yamo	PHP Einsteiger	8	01.01.2011 12:03
Immer und überall Oop?	d0ne	Off-Topic Diskussionen	5	27.09.2010 14:20
[Erledigt] OOP - Stil-Frage zur Objekterzeugung	Baltasar	PHP Tipps 2010	7	24.08.2010 17:39
OOP - Mysql Abfragen machen	chief-thomson	PHP Tipps 2010	10	10.06.2010 13:59
gleich oop lernen oder erst mal prozedural programmieren?	Voltage	PHP Tipps 2010	7	22.01.2010 16:46
Frage zu OOP Klassenplanung	Yanko	PHP Tipps 2010	3	21.01.2010 09:27
100% OOP wirklich sinnvoll ?	Pehapeh	PHP-Fortgeschrittene	31	04.12.2009 11:19
Was bringt OOP wenn Objekte nach jeder Seite sterben?	majorbenks	PHP Tipps 2009	9	18.11.2009 14:11
[Erledigt] OOP & PHP5 Buchempfehlung?	boernard	PHP Tipps 2009	2	26.02.2009 18:32
Einstieg in Objekt-orientierte-Programmierung (OOP) - Erste Versuche :-)	echo	PHP Tipps 2009	20	26.02.2009 11:08
Wer hilft mir bei OOP?	echo	Beitragsarchiv	27	23.02.2009 16:12
Einstieg in Objekt-orientierte-Programmierung (OOP)	echo	PHP Tipps 2009	50	17.02.2009 11:55
OOP verstanden?	stayInside	PHP Tipps 2009	4	24.01.2009 02:57
MVC vs. herkömmliches OOP	stayInside	PHP Tipps 2008	5	26.11.2008 22:47

12.05.2011, 15:00
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	Js oop Hey leute, ich habe mich etwas in OOP in JS eingelesen und habe folgende codes gefunden PHP-Code: `var Foo = function(){ this._privateMethod = function(){ //mach was } this.publicMethod = function(){ //mach was anderes } }` und das hier PHP-Code: `var Foo = function(){} Foo.prototype._privateMethod = function(){ } Foo.prototype.publicMethod = function(){ }` nun wollte ich fragen, wo der unterschied zwischen den beiden varianten ist und welchen man eher nutzen sollte und wieso. hoffe ihr könnt mir hier das erklären MFG __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

12.05.2011, 15:09
ChrisB Moderator¹ Registriert seit: 28.03.2010 Beiträge: 7.470 PHP-Kenntnisse: Fortgeschritten	Fang mal hier an: http://molily.de/js/organisation-instanzen.html Auch die weiteren JS-Artikel von dort sind sehr gut. __________________ RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

12.05.2011, 15:10
mepeisen Erfahrener Benutzer Registriert seit: 21.12.2004 Beiträge: 5.234 PHP-Kenntnisse: Fortgeschritten	Die Funktion in Foo ist gewissermaßen der Konstruktor. Generell sind die Funktionen der Klasse "Foo" sozusagen dynamisch. Beim Anlegen eines Objektes werden sozusagen die Funktionsreferenzen in das Objekt kopiert und können später überschrieben werden. Beispiel: PHP-Code: `var Foo = function() { this.myfunc = function() { alert('MyFunc'); }; }; var FooObject = new Foo(); var FooObject2 = new Foo(); FooObject.myfunc(); FooObject2.myfunc(); FooObject.myfunc = function() { alert('OtherFunc'); }; FooObject.myfunc(); FooObject2.myfunc();` Probiere das mal aus. Private Methoden reinzutun ist extrem schlechter Stil. Javascript kennt weder Vererbung noch private oder protected. Wenn man wirklich geschützte Methoden reintun will, geht beispielsweise folgendes Hilfskonstrukt: PHP-Code: `var Foo = function(){ var me = this; var private1 = function() { me.public2(); }; me.public1 = function() { private1(); }; me.public2 = function() { alert('Hello World'); }; };` Was ist der Unterschied? "private1" lebt nur innerhalb des Konstruktors und auch nur durch Closures innerhalb der Methoden. Von außen lässt sich private1 weder aufrufen noch überschreiben. Es gibt diverse Frameworks, die über ein paar Tricks auch echte Vererbung ermöglichen. Beispielsweise ExtJS/Sencha. __________________ www.php-maven.org PHP und Maven vereint: Build/Deploy/Produktion/Konfiguration, Projekt Management, CI, PHPUnit, zahlreiche Frameworks Twitter @ https://twitter.com/#!/mepeisen und Facebook @ http://t.co/DZnKSUih

12.05.2011, 15:16
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Mal sehen, ob ich das zusammenbekomme. 1. Prototypen-Methoden wirken allgemein (ähnlich wie in PHP-Klassen), wären this.methode()-Methoden an die jeweilige Objektinstanz gebunden werden. Sie werden also für jede Instanz neu „erstellt“ und zugewiesen und verbrauchen damit mehr Speicher. Stell Dir sowas vor: PHP-Code: `var Foo = function(a){ if (a) { this._privateMethod = function(){ //mach was }; this.publicMethod = function(){ //mach was anderes }; } else { this._privateMethod = function(){ //mach was anderes }; } }` - ist durchaus möglich in Javascript. 2. Prototypen-Methoden kennen this nicht. Du kannst dort mit Variablen wie Foo.myVar arbeiten, aber this ist zum Zeitpunkt der Methodenzuweisung noch nicht existent (entsteht erst bei new Object __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

12.05.2011, 15:28
BlackScorp Erfahrener Benutzer Registriert seit: 25.09.2009 Beiträge: 2.114 PHP-Kenntnisse: Fortgeschritten	also um das ganze mal zusammen zu fassen.. die erste von mir aufgeschriebene möglichkeit sollte man nutzen und prototypen sind ledeglich dazu da um neue methoden einer instanz hinzuzufügen bzw zu überschreiben.. habe ich das richtig verstanden? also sollte man prototype nicht nutzen oder? bezüglich private und public.. im netbeans werden alle methoden die mit einem this._ anfangen als private dargestellt und ohne _ als public ich kriege auch bei quellcode vervollständigung keine methode zu sehen die mit _ anfängt sprich PHP-Code: `var Foo = function(){ this._bar = function(){ alert("bar"); } this.bar2 = function(){ alert("bar2"); } } var foo1 = new Foo(); foo1._bar();// geht nicht foo1.bar2(); //geht..` also geht ja private und public in JS ... theoretisch __________________ Mein kleines Projekt -Cruel Online- 5 von 3 Leuten können kein Bruchrechnen

12.05.2011, 15:45
mepeisen Erfahrener Benutzer Registriert seit: 21.12.2004 Beiträge: 5.234 PHP-Kenntnisse: Fortgeschritten	Das mit dem Unterstrich ist lediglich eine Konventionen. Technisch werden die nicht private. Du kannst problemlos die mit Unterstrich aufrufen, egal was NetBeans da beim Code-Vervollständigen treibt. __________________ www.php-maven.org PHP und Maven vereint: Build/Deploy/Produktion/Konfiguration, Projekt Management, CI, PHPUnit, zahlreiche Frameworks Twitter @ https://twitter.com/#!/mepeisen und Facebook @ http://t.co/DZnKSUih

12.05.2011, 15:46
rudygotya Erfahrener Benutzer Registriert seit: 28.05.2008 Beiträge: 2.094 PHP-Kenntnisse: Fortgeschritten	Natürlich kannst du funktional wie oben beschrieben vererben. Alternativ singleton definieren und per Object.create vererben (achtung: ecma5). Dazu gibts auch sehr viele spannende „pseudoklassische“ Vererbungen, hier paar bekannte Vertreter: MooTools Class (leider verändern die den prototype nativer typen... ) Base.js (dean edwards) Prototype.js Class (siehe mootools) jQueryui widget core Googlen, lesen, lesen, lesen und selbst ausprobieren, was dir am besten gefällt Grüße Basti __________________ ++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++ Blog

12.05.2011, 16:18
rudygotya Erfahrener Benutzer Registriert seit: 28.05.2008 Beiträge: 2.094 PHP-Kenntnisse: Fortgeschritten	Ahja, hier noch ein super Nachschlagewerk: javascript garden __________________ ++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++ Blog