L'opérateur d'étalement ne fonctionne pas sur les objets dont la clé est une chaîne de caractères.

Question

J'écris actuellement du code avec ES6 et Babel (présélection es2015) et je n'arrive pas à étendre un objet comme j'en ai l'habitude. Normalement, je prendrais un objet, j'utiliserais un spread et je ferais correspondre le contenu interne comme suit [...someObject].map(dosomestuff) . Mais mon objet ne se comporte pas comme prévu et la seule différence que j'ai trouvée jusqu'à présent sont les clés :

let myObject = {
  'key': content,
  'key2': content,
  'key3': content
};

let array = [...myObject];

Comme l'objet est généré à partir d'une structure de fichier, les clés sont formées par des variables et peuvent inclure des caractères spéciaux, donc je dois les définir comme suit object[key] = value . Pourquoi ne puis-je pas utiliser l'opérateur d'étalement sur cet objet (le tableau est toujours vide) ? Et existe-t-il une solution de contournement aussi confortable que l'opérateur d'étalement (je ne parle pas de créer un nouveau tableau avec Object.keys et de l'utiliser) ?

Answer 1

L'objet spread fonctionne sur les bojets, vous ne pouvez pas étendre un objet dans une array .

Vous devez spread à un autre objet :

let myObject = {
  'key': "content1",
  'key2': "content2",
  'key3': "content3"
};

let myObject2 = {
  'key4': 'content4'
}

let newObj= {...myObject, ...myObject2};
console.log(newObj);

Cela ne fait pas partie de ES6, mais c'est sur étape 3

Answer 2

Pourquoi ne puis-je pas utiliser l'opérateur d'étalement sur cet objet ?

Tout d'abord, ... n'est pas un opérateur ! .

Vous ne pouvez utiliser qu'une pâte à tartiner élément lorsque cet élément est itérable . Les objets ne sont pas itérables.

Existe-t-il une solution de rechange aussi confortable que l'opérateur d'étalement (je ne parle pas de créer un nouveau tableau avec Object.keys et de l'utiliser) ?

Pas dans ES6.

Je présume que vous voulez obtenir la propriété valeurs de l'objet.

Si vous ne voulez pas écrire une fonction d'aide et que vous ne voulez pas nécessairement utiliser un élément de propagation, vous pouvez en fait utiliser la fonction Array.from La possibilité de prendre une fonction de cartographie comme deuxième argument :

Array.from(Array.keys(myObject), x => myObject[x]);

Si vous ne voulez vraiment pas utiliser Object.keys ( Object.values n'existe pas dans ES6), alors vous pouvez écrire vous-même votre propre fonction d'aide en tant que générateur :

function* values(obj) {
  for (var x in obj) {
    // You can use `obj.hasOwnProperty(x)` to guard against inherited properties
    // to achieve the same effect as `Object.keys`
    yield obj[x];
  }
}

let myObject = {
  'key': 'content',
  'key2': 'content1',
  'key3': 'content2'
};

console.log([...values(myObject)]);
// or
console.log(Array.from(values(myObject)));

Answer 3

Avec Chrome, je constate que l'utilisation de l'étalement sur un objet entraîne une exception. Ce qui fonctionne, c'est l'utilisation de Carte