Wie und warum funktioniert ‘a'[‘toUpperCase’]() in JavaScript funktionieren?

JavaScript überrascht mich immer wieder und dies ist ein weiteres Beispiel. Ich bin gerade auf einen Code gestoßen, den ich zuerst nicht verstanden habe. Also habe ich es debuggt und bin zu folgendem Ergebnis gekommen:

alert('a'['toUpperCase']());  //alerts 'A'

Nun muss dies offensichtlich sein, wenn toUpperCase() ist als Mitglied des String-Typs definiert, aber es machte für mich anfangs keinen Sinn.

Wie auch immer,

• funktioniert das denn toUpperCase ist ein Mitglied von ‘a’? Oder geht hinter den Kulissen etwas anderes vor sich?

• das Code Ich habe gelesen, hat eine Funktion wie folgt:

  function callMethod(method) {
      return function (obj) {
          return obj[method](); //**how can I be sure method will always be a member of obj**
      }
  }
  
  var caps2 = map(['a', 'b', 'c'], callMethod('toUpperCase')); // ['A','B','C'] 
  // ignoring details of map() function which essentially calls methods on every 
  // element of the array and forms another array of result and returns it
  

  Es ist eine Art generische Funktion zum Aufrufen IRGENDEIN Methoden an IRGENDEIN Objekt. Aber bedeutet das, dass die angegebene Methode bereits ein implizites Mitglied des angegebenen Objekts ist?

Ich bin sicher, dass mir ein ernsthaftes Verständnis des Grundkonzepts von JavaScript-Funktionen fehlt. Bitte helfen Sie mir, dies zu verstehen.

Um es zu brechen.

• .toUpperCase() ist eine Methode der String.prototype
• 'a' ist ein primitiver Wert, wird aber in seinen umgewandelt Objektdarstellung
• Wir haben zwei mögliche Notationen für den Zugriff auf Objekteigenschaften/-methoden, Punkt- und Klammernotation

So

'a'['toUpperCase'];

ist der Zugang über Klammernotation auf dem Grundstück toUpperCaseaus String.prototype. Da diese Eigenschaft auf a verweist Methodekönnen wir es durch Anhängen aufrufen ()

'a'['toUpperCase']();

foo.bar und foo['bar'] sind gleich, also ist der von Ihnen gepostete Code derselbe wie

alert('a'.toUpperCase())

Beim Benutzen foo[bar] (beachten Sie das Fehlen von Anführungszeichen) Sie verwenden nicht den wörtlichen Namen bar aber was auch immer Wert der Variablen bar enthält. Also mit der foo[] Notation statt foo. ermöglicht Ihnen die Verwendung eines dynamischen Eigenschaftsnamens.

Schauen wir uns mal an callMethod:

Zunächst einmal gibt es eine Funktion zurück, die dauert obj als sein Argument. Wenn diese Funktion ausgeführt wird, wird sie aufgerufen method auf diesem Objekt. Die angegebene Methode muss also nur entweder auf existieren obj selbst oder irgendwo in seiner Prototypkette.

Im Falle von toUpperCase diese Methode kommt von String.prototype.toUpperCase – Es wäre ziemlich dumm, für jeden einzelnen String, der existiert, eine separate Kopie der Methode zu haben.

Sie können entweder mit auf die Mitglieder eines beliebigen Objekts zugreifen .propertyName Notation bzw ["propertyName"] Notation. Das ist das Merkmal der JavaScript-Sprache. Um sicherzugehen, dass das Mitglied im Objekt enthalten ist, prüfen Sie einfach, ob es definiert ist:

function callMethod(method) {
    return function (obj) {
        if (typeof(obj[method]) == 'function') //in that case, check if it is a function
           return obj[method](); //and then invoke it
    }
}

Grundsätzlich behandelt Javascript alles als Objekt, oder vielmehr kann jedes Objekt als Wörterbuch/assoziatives Array angesehen werden. Und Funktionen/Methoden werden genauso für das Objekt definiert – als Eintrag in diesem assoziativen Array.

Im Wesentlichen referenzieren/rufen Sie also (beachten Sie das ‘()‘ ) die ‘toUpperCase’-Eigenschaft des ‘a’-Objekts (das in diesem Fall ein String-Typ ist).

Hier ist ein Code von oben auf meinem Kopf:

function myObject(){
    this.msg = "hey there! ;-)";
    this.woop = function(){
        alert(this.msg); //do whatever with member data
    }
}

var obj = new myObject();
alert( obj.msg );
alert( obj['msg'] );
obj['woop']();

anyObject['anyPropertyName'] ist das gleiche wie anyObject.anyPropertyName Wenn anyPropertyName hat keine problematischen Charaktere.

Sehen Arbeiten mit Objektenvon der MDN.

Das toUpperCase -Methode wird an den Typ String angehängt. Wenn Sie hier eine Funktion für einen primitiven Wert aufrufen 'a'wird es automatisch zu einem Objekt hochgestuft, hier a Schnur :

In Kontexten, in denen eine Methode für einen primitiven String aufgerufen werden soll oder eine Property-Suche stattfindet, umschließt JavaScript automatisch den String-Primitiv und ruft die Methode auf oder führt die Property-Suche durch.

Sie können sehen, dass die Funktion vorhanden ist, indem Sie sich anmelden String.prototype.toUpperCase.

Also in Javascript, objects sind objects. Das heißt, sie sind von dieser Natur {}. Objekteigenschaften können mit einer der folgenden Methoden festgelegt werden: a.greeting = 'hello'; oder a['greeting'] = 'hello';. Beide Wege funktionieren.

Das Abrufen funktioniert genauso. a.greeting (ohne Anführungszeichen) ist 'hello', a['greeting'] ist 'hello'. Ausnahme: Wenn die Eigenschaft eine Zahl ist, funktioniert nur die Klammermethode. Die Punktmethode nicht.

So 'a' ist ein Objekt mit 'toUpperCase' Eigenschaft, die eigentlich eine Funktion ist. Sie können die Funktion abrufen und anschließend so oder so aufrufen: 'a'.toUpperCase() oder 'a'['toUpperCase']().

Aber imo wäre der bessere Weg, die Kartenfunktion zu schreiben, so

var caps = ['a','b','c'].map( function(char) { return char.toUpperCase(); } )

Wer braucht die callMethod dann funktionieren?

Jedes JavaScript-Objekt ist eine Hash-Tabelle, daher können Sie auf seine Mitglieder zugreifen, indem Sie einen Schlüssel angeben. Wenn eine Variable beispielsweise eine Zeichenfolge ist, sollte sie die Funktion toUpperCase haben. Sie könnten es also aufrufen

var str = "a"
str['toUpperCase'](). // you get the method by its name as a key and invoke it.

Also, durch Inline str, könnten Sie unten haben

"a"["toUpperCase"]()