Why can't Javascript spread operator be used after object key?

user_5863693 0
Viewed 1421

I have the following code:

const array = [{
    a: 'a',
    b: 'b'
  }];

  console.log(...array);

  const store = {
    obj: ...array
  }

console.log will print the results just fine. However, when trying to set the key of store I get a Parsing error: Unexpected token.

Isn't ...array a valid object to assign to the obj key of store?

spread-syntax javascript
2 Answers

... spreads out array into individual items. Array can have more than 1 element and hence there will be more than 1 RHS and that will be invalid. Hence, you can use obj : {...array} or obj : [...array]

const array = [{a: 'a',b: 'b'},{c: 'c', d: 'd'}];

console.log(...array);

const store = {
  obj: {...array},
  obj1: [...array]
};
  
  console.log(store);

user_11323540

The spread syntax works inside of objects or iterable. In your case, you need to spread the elements within an array.

Spread Syntax

Spread syntax allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.

const array = [0, 1, 2]
const store = {
  obj: [...array] // <-- the array is being spreded into an array.
}

console.log(store)

user_17151210
Related