Was macht das “new” Keyword in JavaScript?

new Keyword JavaScriptIn meinem Post zum Versuch soetwas wie Klassen in JavaScript zu ermöglichen, hatte ich geschrieben, dass “new” in JavaScript irreführend ist. Nehmen wir folgendes Beispiel:

function Example( a ) { this.a = 2 }
Example.prototype = {
  a: 1,
  b: function() { console.log(this.a); }
};

var test = new Example();
test.b();

“New” kann man eigentlich als Funktion betrachten und was in dieser, quasi hinter den Kulissen, passiert ist folgendes:

  1. Erstelle ein neues (JavaScript-)Objekt
  2. Setze den Typ des neuen Objektes auf “Object
  3. Setze die Eigenschaften (Properties) des Prototyp-Objekts als die Eigenschaften des Prototypes des neu erstellten Objekts.
  4. Führe die Funktion Example aus. Übergebe dieser Funktion hierfür das neu erstellte Objekt als “this” und sofern vorhanden übergebe die restlichen Parameter.
  5. Gebe das erstellte Objekt zurück.

Als Code sieht das dann in etwa so aus:

function new( func ) {
  var NewObject = {};
  NewObject.__proto__ = func.prototype;
  func.apply(NewObject, func.arguments);
  return NewObject;
}

function Example( a ) { this.a = 2 }
Example.prototype = {
  a: 1,
  b: function() { console.log(this.a); }
};

var test = new(Example());
test.b();

Das Beispiel ist sehr flach gehalten und soll wirklich nur der groben Veranschaulichung dienen. Genau nachlesen könnt ihr die Ausführung von “new” hier:

“New” ist also eher eine Art Kopiervorgang gepaart mit der Ausführung einer (Initial-)Funktion. Es ist somit nicht zu verwechseln mit dem “new” in Java oder ähnlichen Sprachen. Was ich in dem Zusammenhang mit irreführend meine ist, dass das “new” in JavaScript eigentlich eingeführt wurde, damit sich Java- und andere Entwickler wohler fühlen, es aber eigentlich etwas ganz anderes macht, als es ein Java-Entwickler erwartet.

Wenn ich in diesem Artikel von Prototyp sprach, meinte ich immer den Function-Prototype in JavaScript. Natürlich ist es nicht möglich eine Funktion “new” zu bennen, das Wort ist reserviert und dient im Beispiel nur der Veranschaulichung.

3 thoughts on “Was macht das “new” Keyword in JavaScript?

  1. Olli

    Verweisen __proto__ und prototype nicht auf das selbe?

    Wenn du an der einen Stelle sagst
    NewObject.__proto__ = func;
    und direkt danach
    NewObject.prototype = func.prototype;
    hast du damit dann nicht die ursprüngliche Zuweisung überschrieben?

    Reply
    1. Benny Bennet Post author

      Hallo Olli,

      vielen Dank für Deinen Kommentar. Irgendwie sind mir in dem Artikel einige Fehler unterlaufen, diese werde ich morgen berichtigen. Ich weiss leider nicht mehr, was mein Gedankengang damals war, wieso ich das so gemacht habe – richtig ist es nicht (wie von Dir angemerkt). Wahrscheinlich war es Unwissenheit, da ich zu dem Zeitpunkt erst damit angefangen habe, mich mit dem Thema näher zu beschäftigen.

      Aber: __proto__ und prototype sind unterschiedliche Dinge.

      Was “new” macht, steht auch relativ gut beschrieben in der ECMA spec:
      http://bclary.com/2004/11/07/#a-11.2.2 hier vor allem weiterführend dann noch wichtig der Abschnitt zum Aufruf des [[Construct]]: http://bclary.com/2004/11/07/#a-13.2.2

      Hier sieht man auch, dass das Kopieren der Object Properties nicht stattfindet, wie fälschlicherweise oben im Code angegeben.

      Danke und Gruß,
      Benny

      Reply
      1. Benny

        Der Artikel wurde einem kleinen Korrektur-Update unterzogen und ist nun korrekt. Er gibt aber nur die Vogel-Perspektive wieder, da dies ausreichend ist um die Verwirrung von “new” in JavaScript zu erklären. Nähere Details bitte der ECMAScript Spec entnehmen.

        Reply

Leave a Reply to Benny Bennet Cancel reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>