Ajouter une propriété à un objet JavaScript en utilisant une variable comme nom?

Je tire des éléments du DOM avec jQuery et je veux définir une propriété sur un objet en utilisant l' idélément DOM.

Exemple

const obj = {}

jQuery(itemsFromDom).each(function() {
  const element = jQuery(this)
  const name = element.attr('id')
  const value = element.attr('value')

  // Here is the problem
  obj.name = value
})

Si itemsFromDominclut un élément avec un idde "myId", je veux objavoir une propriété nommée "myId". Ce qui précède me donne name.

Comment nommer une propriété d'un objet à l'aide d'une variable à l'aide de JavaScript?

Vous pouvez utiliser cette syntaxe équivalente:

obj[name] = value

Avec ECMAScript 2015, vous pouvez le faire directement dans la déclaration d'objet en utilisant la notation entre crochets:

var obj = {
  [key]: value
}

Où keypeut être n'importe quelle sorte d'expression (par exemple une variable) renvoyant une valeur:

var obj = {
  ['hello']: 'World',
  [x + 2]: 42,
  [someObject.getId()]: someVar
}

Vous pouvez même créer une liste d'objets comme celui-ci

var feeTypeList = [];
$('#feeTypeTable > tbody > tr').each(function (i, el) {
    var feeType = {};

    var $ID = $(this).find("input[id^=txtFeeType]").attr('id');

    feeType["feeTypeID"] = $('#ddlTerm').val();
    feeType["feeTypeName"] = $('#ddlProgram').val();
    feeType["feeTypeDescription"] = $('#ddlBatch').val();

    feeTypeList.push(feeType);
});

Il existe deux notations différentes pour accéder aux propriétés des objets

• Dot notation: myObj.prop1
• Support notation: myObj [ "prop1"]

La notation par points est rapide et facile, mais vous devez utiliser explicitement le nom réel de la propriété. Pas de substitution, de variables, etc.

La notation entre parenthèses est ouverte. Il utilise une chaîne mais vous pouvez produire la chaîne en utilisant n'importe quel code js légal. Vous pouvez spécifier la chaîne comme littérale (bien que dans ce cas la notation par points serait plus facile à lire) ou utiliser une variable ou calculer d'une manière ou d'une autre.

Ainsi, ceux - ci configurent le myObj propriété nommée prop1 à la valeur Bonjour :

// quick easy-on-the-eye dot notation
myObj.prop1 = "Hello";

// brackets+literal
myObj["prop1"] = "Hello";

// using a variable
var x = "prop1"; 
myObj[x] = "Hello";                     

// calculate the accessor string in some weird way
var numList = [0,1,2];
myObj[ "prop" + numList[1] ] = "Hello";     

Pièges:

myObj.[xxxx] = "Hello";      // wrong: mixed notations, syntax fail
myObj[prop1] = "Hello";      // wrong: this expects a variable called prop1

tl; dnr : Si vous voulez calculer ou référencer la clé, vous devez utiliser la notation entre crochets . Si vous utilisez explicitement la clé, utilisez la notation par points pour un code clair simple.

Remarque: il existe d'autres bonnes et bonnes réponses, mais personnellement, je les ai trouvées un peu brèves en raison d'une faible connaissance de la bizarrerie à la volée de JS. Cela pourrait être utile à certaines personnes.

Avec lodash, vous pouvez créer un nouvel objet comme celui-ci _.set :

obj = _.set({}, key, val);

Ou vous pouvez définir un objet existant comme ceci:

var existingObj = { a: 1 };
_.set(existingObj, 'a', 5); // existingObj will be: { a: 5 }

Vous devez faire attention si vous souhaitez utiliser le point (".") Dans votre chemin, car lodash peut définir une hiérarchie, par exemple:

_.set({}, "a.b.c", "d"); // { "a": { "b": { "c": "d" } } }

Nous devons d'abord définir la clé comme variable, puis nous devons affecter la clé comme objet., Par exemple

var data = {key:'dynamic_key',value:'dynamic_value'}
var key = data.key;
var obj = { [key]: data.value}
console.log(obj)

Avec l'avènement de ES2015 Object.assign et des noms de propriété calculés, le code de l'OP se résume à:

var obj = Object.assign.apply({}, $(itemsFromDom).map((i, el) => ({[el.id]: el.value})));

Si vous souhaitez ajouter des champs à un objet de manière dynamique, la manière la plus simple de le faire est la suivante:

 var params= [
{key: "k1", value=1},
{key: "k2", value=2},
{key: "k3", value=3}];

for(i=0; i< params.len; i++) {
  data[params[i].key] = params[i].value
}

Cela créera un objet de données qui a les champs suivants:

{k1:1, k2:2, k3:3}

Si vous avez un objet, vous pouvez créer un tableau de clés, puis le mapper et créer un nouvel objet à partir des clés d'objet et des valeurs précédentes.

Object.keys(myObject)
.map(el =>{
 const obj = {};
 obj[el]=myObject[el].code;
 console.log(obj);
});

ajavascript a deux types d'annotation pour récupérer les propriétés des objets javascript:

Obj = {};

1) (.) Annotation par exemple. Obj.id cela ne fonctionnera que si l'objet a déjà une propriété avec le nom 'id'

2) ([]) annotation par exemple. Obj [id] ici si l'objet n'a pas de propriété avec le nom 'id', il créera une nouvelle propriété avec le nom 'id'.

donc pour l'exemple ci-dessous:

Une nouvelle propriété sera toujours créée lorsque vous écrivez Obj [nom]. Et si la propriété existe déjà avec le même nom, elle la remplacera.

const obj = {}
    jQuery(itemsFromDom).each(function() {
      const element = jQuery(this)
      const name = element.attr('id')
      const value = element.attr('value')
      // This will work
      obj[name]= value;
    })

Lié au sujet, pas spécifiquement pour jquery. J'ai utilisé cela dans des projets ec6 react, peut-être aide quelqu'un:

this.setState({ [`${name}`]: value}, () => {
      console.log("State updated: ", JSON.stringify(this.state[name]));
    });

PS: Attention au caractère de citation.

objectname.newProperty = value;

const data = [{
    name: 'BMW',
    value: '25641'
  }, {
    name: 'Apple',
    value: '45876'
  },
  {
    name: 'Benz',
    value: '65784'
  },
  {
    name: 'Toyota',
    value: '254'
  }
]

const obj = {
  carsList: [{
    name: 'Ford',
    value: '47563'
  }, {
    name: 'Toyota',
    value: '254'
  }],
  pastriesList: [],
  fruitsList: [{
    name: 'Apple',
    value: '45876'
  }, {
    name: 'Pineapple',
    value: '84523'
  }]
}

let keys = Object.keys(obj);

result = {};

for(key of keys){
    let a =  [...data,...obj[key]];
    result[key] = a;

}