2012-09-26 13 views
14

JavaScript oferuje wiele sposobów deklarowania obiektów. Gdy masz większość dostępnych danych pod ręką, najwygodniejszy (moim zdaniem) jest następujący:Składnia deklaracji obiektu JavaScript - nazwy zmiennych jako właściwości

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

Ciekawa rzecz o tej składni jest to, że jest on identyczny do tego:

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

Oznacza to, że możesz użyć cudzysłowów lub pominąć je dla nazw właściwości.

Porównując to do sposobu ustawiania pojedynczych dzieł własności, masz dwie opcje:

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

lub

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

W „kropka składni” działa tylko wtedy, gdy prawy operand jest rzeczywista Nazwa właściwości. Jeśli chcesz użyć zmiennej dla nazwy właściwości, trzeba użyć „array składni”, a mianowicie:

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

Teraz możliwe jest użycie zmiennej dla nazwy właściwości w „object składni dosłowne” ? Ponieważ nie ma znaczenia, jeśli podajesz nazwy właściwości, nie wydaje się oczywistym sposobem użycia zmiennej. Czekam na coś takiego:

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

Tutaj używam (prop) jako wyimaginowanego składni, aby wyrazić, że jest to zmienna, a nie ciągiem znaków.

Dzięki.

+0

myślę, że trzeba trzymać się składni tablicy .. może eval (+ prop +”=„12 stycznia "") wystarczy, ale nie sądzę, aby było to optymalne rozwiązanie. –

+1

@PhilippeBoissonneault - Ack! Eval jest * nie * potrzebny ... proszę nie używać go w tym kontekście. –

+0

Szukasz odpowiednika zmiennych zmiennych PHP: '$ foo = bar; $ bar = '123'; echo $$ foo; // faktycznie wyświetla '123'' – Ray

Odpowiedz

3

ES6 teraz pozwala na to: '. osoby

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

Nie, to nie zadziała, dlatego jeśli dynamicznie ustawiane są nazwy właściwości, sugerowana i używana jest tablica typu notacja.

var k='propertyname'; 
object[k]="value"; 

działa to przy użyciu zapisu kropkowego do ustawienia indeksu lub nazwy właściwości z vatiable nie jest możliwe.

+0

Uważam, że fraza 'nawias klamrowy' jest preferowana, ale poza tym tak. –

2

Nie można tego zrobić z obiektami, ale jeśli wziąć pod uwagę przy użyciu funkcji konstruktora zamiast, może to wyglądać mniej więcej tak:

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

Oczywiście nadal masz notacji tablicy tutaj, ale może chcesz to i tak aproach :)

4

dla osób, które potrzebują zastąpienie drop-in dla dot składni gdzie klucze są obiekty zamiast strun (powiedzmy na zagnieżdżenie wewnątrz obiektu nadrzędnego), oto kilka obejścia:

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 

Element anarchistyczny używa self-executing-function, który pobiera śmieci zebrane po wywołaniu, a element konformistyczny używa funkcji _.object(), jeśli możesz umieścić w witrynie underscore.js.

Życzę, aby wbudowane funkcje Object() i Array() pozwalały na przekazywanie kluczy i wartości w sposób podkreślenia.js robi :-)

+0

Spadek funkcji samoukających jest def moim preferowanym rozwiązaniem +1 – Fydo

Powiązane problemy