JavaScript Dot notation auf einem Array?

[Hendoul]

Hi

Ich bin soeben über folgenden Code gestolpert und frage mich was das .val überhaupt macht auf einem Array?
Ich kenne die dot notation nur auf einem Objekt, aber nicht auf einem Array. Danach ist myArray kein Array mehr sondern ein Object. (ok in JS ist ja alles ein Object...) Aber ich verstehe den Sinn dahinter nicht auf einem Array dot notation zu verwenden.

var myArray = [
    {
        val() {},
    }
];

myArray.val = function() {   // myArray.val <-- was macht das?
    return myArray[0].val();
};

 

[Bagbag]

Du greifst mit .val() nicht auf das Array zu, sondern auf das erste Element im Array, welches in diesem Fall ein Objekt ist.

 

[Hendoul]

Hä? Entweder ich verstehe dich nicht, oder du meinst die Falsche Zeile.

myArray.val <-- was bringt das? Hier weisst man dem property doch eine Funktion zu. Aber auf einem Array?

 

[Defender1st]

Hier stand Blödsinn :>

 

[Yuuri]

Lies dich mal in Prototyping bei JS ein. Dein Beispiel ist allerdings Bad Practice, weil du so den Prototype von dem Objekt selbst änderst und Funktionen damit definitiv Errors werfen.

myArray.forEach( x => console.log( x ) )
{val: ƒ}
undefined

[1,2,3].forEach( x => console.log( x ) )
1
2
3

 

[Hendoul]

Ja aber dann müsste es doch so aussehen myArray[0].val = function...?

 

[marcOcram]

Ich meine, dass in JavaScripts Arrays nicht anderes als "spezielle" Objekte sind. Somit kannst du Arrays auch Funktionen hinzufügen.

Dein Skript macht Folgendes:

• Es legt das Array myArray an
  • myArray beinhaltet ein Object
    • Dieses Object wiederum hat eine Funktion val() { }
• Nun weist du deinem Array myArray eine neue Funktion val zu
  • Diese Funktion greift auf das erste Element in myArray zu (das oben erstellte Objekt) und ruft die Funktion val() {} von dem Objekt auf.

Damit es evtl. einleuchtender wird. Das Beispiel mal etwas anders:

var myArray = [
    {
        val1() { console.log("Hello World!") },
    }
];

myArray.val2 = function() {
    return myArray[0].val1();
};

myArray.val2(); // Hello World!
myArray.val1(); // error

 

[Hendoul]

Danke Ocram und auch an die anderen für die Erklärung