JavaScript JavaScript OOP ? Inheritance?

nemo_XY

Cadet 3rd Year
Registriert
Juli 2015
Beiträge
41
Hallo,
Ich dachte eigentlich ich hätte JS OOP verstanden aber wie es scheint habe ich es nicht.

Ja, ich habe bereits viele Tutorials durch, aber genau die Dinge die dort beschrieben werden, zB die visibility treffen einfach nicht zu. Für mich gibt es in JS einfach viel zu viele Möglichkeiten das selbe zu machen....

Gibt es Unterschiede wenn ich Methoden zu Klassen per protoype oder direkt in der Klasse definiere?
Code:
function foo(){
var x
var y

return {
get: function(){
asdf
}}

//gegenüber:
foo.protoype.get=function(){asdf};

Wie mache ich eine Methode private?

Code:
function Blob(){

return{ Funktionen...}

//weder 
function read(){todo}
//noch
var read = function(){}
}
macht die Methoden privat.

Wann wird eine Methode zur Klassenmethode?

Code:
function Blob(){
this.func = function(){}
}
Kann ebenso von Blob aufgerufen werden und nicht nur vom Object Blob.

Welche Gründe kann es geben, wenn vom Object Methoden aufgerufen werden können welche die Klasse nicht bereitstellt aber die Methoden in einem verwendeten Object zur Verfügung stehen?

Code:
function Blob(){
var reader = new FileReader();}

var x = new Blob();
x bietet mir in diesem Fall jetzt Methoden von FileReader an obwohl ich keine einzige meiner Methoden so benannt habe, dass selbe trifft auch zu wenn ich reader auskommentiere. wtf?

Ich dachte eigentlich ich würde mit prototype Klassen Vererben aber was mache ich dann mit extend und inherit?
 
prototype ist mehr dazu da gezielt (nachträglich) etwas zu verändern. z.b. hast zwei Auto Objekte und du willst nur einem eine neue Eigenschaft verpassen, dann machst das per prototype auf eines von beiden. Du kannst auch beiden die gleiche Eigenschaft verpassen wenn du die Vater Klasse von Auto prototypest, alles drunter erbt dann automatisch.

Aber JS ist eine Katastrophe für sich ... schwachsinnigste Sprache die es gibt.
 
Zuletzt bearbeitet von einem Moderator:
prototype ist mehr dazu da gezielt (nachträglich) etwas zu verändern
Dann hast du das Konzept der prototypen nicht verstanden, auch der Rest deines Textes zeugt nicht von viel Ahnung .. aber am Ende meckern das JS eine Katastrophe ist.

Gibt es Unterschiede wenn ich Methoden zu Klassen per protoype oder direkt in der Klasse definiere?
Ja gibt es. Wenn du Methoden per prototype zu einer Klasse (passend wäre eher Pseudoklasse, da eine reine Klassensyntax bestandteil von ES6 ist) hinzufügst, existiert die Methode nur einmal im Speicher, das sie über alle Instanzen geteilt verwendet wird. Definierst du die Methode direkt in der Pseudoklasse wird bei jeder Instanzierung auch die Methode neu im Speicher angelegt.

Und ja, ... in JS gibt es etliche Möglichkeiten ein neues Objekt mit Prototypen zu erzeugen.
Hier ein recht guter Artikel: https://github.com/getify/You-Dont-Know-JS/blob/master/this & object prototypes/ch6.md
 
Zuletzt bearbeitet:
rob- schrieb:
prototype ist mehr dazu da gezielt (nachträglich) etwas zu verändern. z.b. hast zwei Auto Objekte und du willst nur einem eine neue Eigenschaft verpassen, dann machst das per prototype auf eines von beiden. Du kannst auch beiden die gleiche Eigenschaft verpassen wenn du die Vater Klasse von Auto prototypest, alles drunter erbt dann automatisch.
Es gibt keine Klassen in Javascript. Das fügen erst kommende Javascript-Versionen ein. ActionScript (manchen von Flash her vielleicht bekannt) ist unteranderem ein um das Klassenkonzept erweitertes Javascript.

by the way: Microsofts TypeScript macht diese und andere Features schon jetzt verfügbar. Es bietet ein TypeScript-to-Javascript Compiler.


rob- schrieb:
Aber JS ist eine Katastrophe für sich ... schwachsinnigste Sprache die es gibt.
Du hast noch nie in INTERCAL oder Brainfuck programmiert. :-)

Es ist halt ein anderer Ansatz, der durchaus auch interessant ist (ok; er ist nicht neu, sondern im wesentlichen von Self übernommen).

Der Preprozessor CoffeeScript bietet übrigens ein wesentlich angenehmeren Zugang zu Javascript. Gerade wenn man schon beispielsweise Ruby oder Python gewohnt ist.

Gruß
Andy
 
Der Preprozessor CoffeeScript bietet übrigens ein wesentlich angenehmeren Zugang zu Javascript. Gerade wenn man schon beispielsweise Ruby oder Python gewohnt ist.
Ich komm aber von JAVA ;P

Gibt es denn wirklich keine Möglichkeit eine Klassenvariable private zu machen? Bei ein paaar Tutorials steht, dass this.xxx Daten private macht aber die Realität sieht anders aus. Und anscheind kann man Methoden mit den : nur innerhalb eines return Blocks anwenden, die sind dann auch immer public...

Warum ich die Methoden von einer Klasse aufrufen kann obwohl ich kein Objekt davon habe frage ich mich noch immer....

Kann mir mal jemand bei der Fehlermeldung weiterhelfen?: "this.moved is not a function"
Code:
State.prototype.init=function() {
this.elem.addEventListener("mousemove",function(e){this.moved(e);},false);
}

State.prototype.moved=function(e) {stuff}

Denn selben Fehler bekomm ich interessanterweise auch wenn ich this.elem.mousemove(......) oder .on("mousemove",..) von JQuery verwende.
 
Eine Variable macht man private in dem man sie mit var deklariert. this.blub wäre public.
 
Kann mir mal jemand bei der Fehlermeldung weiterhelfen?: "this.moved is not a function"
Weil du über den Eventlistener einen neuen Kontext initialisierst. this bezieht sich nun auf das Element, worauf dein Event registriert ist und nicht mehr auf die Pseudoklasse (bitte nicht Klasse verwenden ... weil es keine ist).

Code:
State.prototype.init=function() {
this.elem.addEventListener("mousemove",function(e){this.moved(e);}.bind(this),false);
}

Ich komm aber von JAVA ;P
Du musst von deiner Java denkweise wegkommen wenn du JS Code schreibst :)
 
Zuletzt bearbeitet:
Man sollte ohnehin nicht mit this arbeiten, sondern immer am Anfang der Klasse var self = this machen und dann mit der Variable self arbeiten.
 
thecain schrieb:
Du rufst die funktion ja auch auf, bevor sie überhaupt deklariert ist...

Hää?

Man sollte ohnehin nicht mit this arbeiten, sondern immer am Anfang der Klasse var self = this machen und dann mit der Variable self arbeiten.

Das hab ich bereits mehrmals gesehen... Das heißt bei jeder Methode das Object zu übergeben?


Weil du über den Eventlistener einen neuen Kontext initialisierst. this bezieht sich nun auf das Element, worauf dein Event registriert ist und nicht mehr auf die Pseudoklasse (bitte nicht Klasse verwenden ... weil es keine ist).

Das heißt elem ist jetzt mein this?

Sollte das bind() etwas ändern? Bei mir bleibt die gleiche Fehlermeldung.

...Das heißt dann am besten einfach das Object zu übergeben, bei Methoden die von Events aufgerufen werden?
 
Es gibt in JS keine Klassen und deshalb hauch keine Klassenvariablen. Dementsprechend auch keine "privaten" Klassenvariablen. Und auch keine Methoden.

Es gibt Objekte, welche komplett zur Laufzeit erstellt und verändert werden. Und Funktionen, das sind im Grunde aber auch nur Objekte, welche ausführbaren Code enthalten.
Es sieht vielleicht nach Java aus und das new gaukelt einem vor es gäbe Klassen, es macht aber was komplett anderes.
Wie @palace4d schon sagte, man muss die alten Denkweisen loswerden um die neue Sprache zu verstehen.

Wenn man etwas "privat" halten will, nimmt man in JS sogenannte Closures. Die wirken im ersten Moment vielleicht merkwürdig, machen aber Sinn, wenn man begreift dass Funktionen auch immer zur Laufzeit erstellt werden.

Closures gibt es übrigens auch in Java 8 ;) Lohnt sich das Konzept zu verstehen.
 
Wie @palace4d schon sagte, man muss die alten Denkweisen loswerden um die neue Sprache zu verstehen.
Jup, dass ist mir schon klar, aber wie mach ich das?^^

Closures gibt es übrigens auch in Java 8 Lohnt sich das Konzept zu verstehen.
Ja, habe ich mir schon etwa angeschaut. Aber ich sehe nicht wo ich die noch gebrauchten könnte außer bei Streams und bei Methodenparametern ganz praktisch. Aber ich habe noch kein Beispiel gesehn wo es nur mit Closures möglich gewesen wäre bzw. sie es großartig vereinfacht hätten (mal abgesehn, dass man total unnötige Methodendeklarationen einspart).

Nochmal wegen Referenceerror.
Ich habe jetzt meine Methoden in die Pseudoklasse gesteckt und eine Variable für this angelegt, aber jetzt bekomme ich direkt bei der Methodendeklaration einen Referenceerror not defined und sogar bei der Referenzvariable...

Code:
function State(elem){
this.elem = elem;
.....
var myReference = this; //Error

function moved(e){stuff}; //Error
...
function init(){
this.elem.addLis.....;};
this.init();
}
Wenn ich mir Tutorials ansehe ist das doch eine private Methode und Variable warum sollte ich da Error bekommen?
 
Du hast seinen Fehler ja auch korrigiert :-)
Er hat bei sich stehen:
Code:
function init() {
...
}
this.init();

init ist hier private. this.init() existiert also nicht.
Richtig ist also:
Code:
this.init = function() {
...
}
this.init();


Dann sollte es auch funktionieren.
 
Jup, hab ich inzwischen auch rausgefunden :)

Eine letzte Frage noch, dann schau ich mir wieder ein paar Tutorials an...

Code:
function Class1{
   var cla = new MyClass2();
   myRef=this;
   }
   Class1.prototype.irendeinefunc=function(){
       myRef.cla.setFunc(23);
       myRef.cla.publicFunc();}


function Class2{
   this.x, this.h=34;
    return{
       publicFunc: function(param){
         this.h;
         this.x;
        },
        setFunc: function(x){
         this.x=x;
      }
}
Wenn ich nun in publicFunc h abfrage wird mir gesagt, dass es undefiniert ist, aber wenn ich x abfrage, welches durch setFunc verändert wurde ist vorhanden, weshalb? Erstelle ich durch return wieder einen Closure und dadurch werden die "Klassenvariablen" verdeckt? Aber wieso kann dann setFunc die Variable korrekt setzen? Oder setze ich durch setFunc() tatsächlich eine Variable this.x und this.x in publicFunc() greift dann auf diese zu?

Und wenn ich jetzt publicFunc() auslagere, entweder als prototype oder mit var publicFunc() = function{} ehralte ich beim caller TypeError: myRef.cla.publicFunc is not a function, huh?
 
Ich verstehe schon wieder nicht was du eigentlich willst - warum machst du nicht einfach ein fiddle (sind genau zwei Clicks Arbeit) dann sehen wir die Fehlermeldungen selbst und es gibt keine Missverständnisse?

Der Code den du gepostet hast funktioniert so oder so nicht, da wird der erste Error schon in Zeile 1 auftreten wegen Class1{ statt Class1(){ dann hast du MyClass2 und Class2...
Ergänzung ()

Code hier einfach anpassen wie du es willst - inkl dem Aufruf der den Fehler verursach, dann oben auf "Fork" und den neuen Link hier posten... https://jsfiddle.net/se03ewvL/
 
Am besten weitergeholfen hat mir Douglas Crockford, vorallem seine Vorträge bei Yahoo. Zu finden sind die Videos bei Youtube. Der gute Mann arbeitet(e)? am Javascript Standard!

Mittles der Vorträge lässt sich schnell lernen. Vorallem Objekte, Funktionen, this und Prototypen.
 
Zurück
Oben