web-dev-qa-db-fra.com

Utiliser une chaîne concaténée (dynamique) comme clé d'objet JavaScript?

var test = "test123"
var test123 ={
    "key" + test: 123
}

Ce code ne fonctionne pas. Quel est le problème avec "clé" + test?

javascriptsyntaxobject-literal
43
thinkanotherone

Car "key" + test est une expression et non un identificateur, ni un littéral de chaîne ni un littéral de nombre, qui sont les seules choses autorisées comme clé dans un littéral d'objet.

Vous devez utiliser le [] notation après avoir créé l'objet pour une telle clé dynamique:

var test123 = {};
test123["key" + test] = 123;

Un identifiant est essentiellement le même sous-ensemble de caractères que vous pouvez appeler une variable (lettres, chiffres, _ et $; ne peut pas commencer par un nombre), et un littéral de chaîne est une chaîne entourée de ' ou ".

Ainsi, les seuls types de clés que vous pouvez utiliser dans un littéral objet sont:

{
  a0:   true, // valid identifier
  $$_:  true, // same
  123:  true, // valid numeric literal
  012:  true, // same (octal)
  0xf:  true, // same (hex)
  "@":  true, // not allowed as an identifier
  '0a': true  // same
}

Référence: http://es5.github.com/#x11.1.5 .

PropertyName :

IdentifierName

StringLiteral

NumericLiteral

66
pimvdb

Avec ES6, vous pouvez définir des clés dynamiques dans un littéral d'objet:

const test = "test123"
const test123 = { [`key${test}`]: 123 };  //{ keytest123: 123 }
46
Ben

Vous pouvez mais pas avec la notation littérale (pré ES6).

var test123 = {};
test123["foo" + "bar"] = 'baz';

test123.foobar === 'baz'; // true
10
max

Votre code est équivalent à test123.("key" + test) = 123 ce qui peut mieux vous aider à comprendre pourquoi il est incorrect.

Vous avez besoin ["name"] notation pour pouvoir accéder aux champs par leur nom en chaîne. Autres notations (la vôtre et . un) nécessitent des identifiants.

3
Krizz

Javascript propose deux façons de définir une propriété d'un objet:

  1. object.propertyName = valeur;

Dans cette situation, le propertyName n'est pas modifiable et non calculable. vous ne pouvez pas faire ce qui suit:

    object.('property'+'Name')

comme vous pouvez le voir

    object = {propertyName:value};
    object = {'propertyName':value};

ils sont égaux

  1. vous pouvez utiliser une variable comme nom de propriété avec "[]";

tu peux faire :

 var a  = "propertyName";
 object[a] = value;

et cette fois vous devez utiliser une chaîne

object[propertyName] = value;//error
object["propertyName"] = value;//correct
object = {'propertyName':value};//correct
object = {propertyName:value};//correct
2
jilykate