2012-09-26 11 views
14

JavaScript gibt Ihnen viele Möglichkeiten, Objekte zu deklarieren. Wenn Sie die meisten der verfügbaren Daten zur Hand haben, ist die bequemste (meiner Meinung nach) wie folgt:JavaScript-Objektdeklarationssyntax - Variablennamen als Eigenschaften

var person = { 
    name: 'John', 
    age: 23 
}; // "object literal syntax" 

Eine merkwürdige Sache über diese Syntax ist, dass es zu dieser identisch ist:

var person = { 
    'name': 'John', 
    'age': 23 
}; // "object literal syntax" 

Das heißt, Sie können Anführungszeichen verwenden oder sie für die Eigenschaftsnamen weglassen.

Wenn das die Art und Weise zu vergleichen eine einzige Eigenschaft Werkseinstellung, haben Sie zwei Möglichkeiten:

person.birthday = "January 12"; // "dot syntax" 

oder

person['birthday'] = "January 12"; // "array syntax" 

Die „Punktsyntax“ funktioniert nur, wenn der rechte Operand die tatsächlichen ist Name des Anwesens. Wenn Sie eine Variable für den Eigenschaftsnamen verwenden möchten, müssen Sie „Array-Syntax“, das heißt:

var prop = "birthday"; 
person[prop] = "January 12"; 

Jetzt ist es möglich, eine Variable für den Eigenschaftsnamen in der „Objektliteral Syntax“ zu verwenden, ? Da es keine Rolle spielt, wenn Sie die Eigenschaftsnamen angeben, scheint es keine offensichtliche Möglichkeit zu geben, eine Variable dort zu verwenden. Ich bin auf der Suche nach so etwas wie folgt aus:

var prop = "birthday"; 
var person = { 
    name: 'John', 
    age: 23, 
    (prop): 'January 12' 
}; 

Hier bin ich mit (prop) als imaginäre Syntax verwendet, um auszudrücken, dass dies eine Variable und nicht um eine Zeichenkette.

Danke.

+0

Ich denke, Sie werden auf die Array-Syntax haften haben .. vielleicht eval (+ prop +‘=„12. Januar "') wird den Trick machen, aber ich denke nicht, dass dies die optimale Lösung ist –

+1

@PhilippeBoissonneault - Ack! Eval wird * nicht * benötigt ... bitte benutze es nicht in diesem Zusammenhang. –

+0

Sie suchen nach dem Äquivalent der PHP-Variablen: '$ foo = bar; $ bar = '123'; echo $$ foo; // zeigt tatsächlich '123' 'an – Ray

Antwort

3

ES6 ermöglicht jetzt das: 'Person'

var obj = { 
    [prop]: 'value' 
}; 
7

Nein, das wird nicht funktionieren, deshalb wird, wenn Sie Eigenschaftennamen dynamisch festlegen, eine arrayähnliche Notation vorgeschlagen und verwendet.

Dies funktioniert, während die Punktnotation verwendet wird, um den Index oder den Eigenschaftsnamen von vatiable zu setzen, ist nicht möglich.

+0

Ich glaube, dass der Begriff Klammernotation bevorzugt wird, aber ansonsten ja. –

2

Sie können dies mit Objekten nicht tun, aber wenn Sie stattdessen eine Konstruktorfunktion betrachten verwenden, könnte es etwa so aussehen:

var prop = "birthday"; 
var Person = function() { 
    this.name = "Bob"; 
    this[prop] = "January 12"; 
}; 
var bob = new Person(); 

Natürlich kann man immer noch die Array-Schreibweise hier haben, aber vielleicht Sie mögen diese aproach sowieso :)

4

für Menschen, die ein Drop-in-Ersatz für Punkt-Syntax müssen, wo die Schlüssel sind Objekte anstelle von Strings (sagen wir für innerhalb eines übergeordneten Objekt nisten), hier sind einige Lösungen:

var developers = { 
    person: { 
     'name': 'John', 
     'age': 23 
    }, 
    anarchist: (function(){ var a = {}; 
     a['name'] = 'John'; 
     a['age'] = 23; 
     a[false] = false; 
     a[1] = 1; 
     a[window] = window; 
    return a; })(), 
    conformist: _.object([ 
     ['name', 'John'], 
     ['age', 23], 
     [false, false], 
     [1, 1], 
     [window, window] 
    ]) 
}; 

// console.log(developers); // <- to see var dump in Firebug 

Das anarchistische Element verwendet eine self-executing-function, die nach dem Aufruf eine Speicherbereinigung erhält, und das konforme Element verwendet die _.object()-Funktion, wenn Sie in Ihre Site "underscore.js" aufnehmen können.

Ich wünsche, dass die integrierten Object() - und Array() - Funktionen für die Weitergabe von Schlüsseln und Werten die Art und Weise unterstreichen.js tut es :-)

+0

ist ein Rückgang der selbstanrufenden Funktionen meine bevorzugte Lösung +1 – Fydo

Verwandte Themen