Kommas in Javascript

Question

(function() {

$('html').addClass('js');

var contactForm = {

    container: $('#contact'),          <-- DIESE KOMMA

    init: function() {
        $('<button></button>', {
            text: 'Kontaktiere mich'
        })
            .insertAfter('article:first')
            .on('click', this.show);
    },  <---------------------------------- UND DIESE KOMMA

    show: function() {
        contactForm.container.show();
    }
};

contactForm.init();

})();

In dem obigen Skript habe ich festgestellt:

container: $('#contact'),

Ist das eine Möglichkeit, eine Variable zu deklarieren? Das folgende bricht das Skript:

var container = $('#contact');

Außerdem, was ist es mit den Kommas nach der init Funktion und der Container-Variablen (falls es sich um eine Variable handelt)?

Answer 1

Auf diese Weise deklarieren Sie ein Objekt:

var contactForm = {
    // Eigenschaften:
    property1 : Wert,
    property2 : Wert,
    property3 : Wert,

    // Methoden:
    method1 : function() {
        // ...
    },
    method2 : function() {
        // ...
    }
};

Weitere Informationen zu JavaScript-Objekten finden Sie auf MDN ...und in den Kommentaren unten :)

Answer 2

Dieses Codeblock (beginnend mit var contactForm = {) deklariert ein Objekt unter Verwendung der Objektliteralnotation. Kommas trennen die verschiedenen Schlüssel-Wert-Paare in der Objektliteralnotation.

var obj = { key1: value1, key2: value2 };

Answer 3

Kommas werden verwendet, um Name/Wert-Paare beim Definieren von Objekten zu trennen:

var newObj = {
  name: value,
  another_name: another_value
};

Answer 4

Dies sind Schlüssel:Wert-Paare des Objekts contactForm, die du durch Kommas getrennt definiert hast

var obj = { key1 : value1, 

            key2 : value2

            method1 : function(){
              // Definition
            },
            method2 : function(){
              // Definition
            }
}

Das, was mich in meinen Anfangstagen verwirrt hat, ist, was function(){....} innerhalb einer Variablen (in diesem Fall einem Objekt) Definition tut, bis ich entdeckt habe, dass Funktionen in js auch Objekte sind, was möglicherweise nicht der gleiche Fall ist wie in der Sprache, die du zuvor verwendet hast .

Und diese Funktion function(){....} ohne Namen wird als anonyme Funktion bezeichnet.

Hier ist ein guter Thread über anonyme Funktionen Warum muss man eine anonyme Funktion in der gleichen Zeile aufrufen?

Answer 5

Dies wird als Objektliteralnotation bezeichnet.

Es handelt sich im Grunde um eine komma-separierte Liste von Name/Wert-Paaren, die in geschweifte Klammern eingefasst sind.

Der Vorteil dieser Notation besteht darin, dass alle Daten innerhalb der Klammern eingeschlossen sind und nicht global definiert werden, was Konflikte mit anderen Skripten oder Bibliotheken vermeidet.