Questions tagged [spread-syntax]

Please use this tag to refer to "..." (spread) syntax in JavaScript. Do not use for R language "spread" function, use [spread] instead. The spread syntax allows an iterable such as an array expression or string to be expanded in places where arguments for function calls, elements for array literals, or key-value pairs for object literals are expected.

Usage guidance

Use for questions about the ... (spread) syntax in ECMAScript.

Do not use for R language spread function, use instead.

About

Spread is a syntax added in ES6 allowing for substituting an iterable where a list of elements (e.g. in a function call) is expected:

(() => {
    const print = (q, a) => console.log(`-${q}? -${a}`);
    print(...["*", 42]); // spread in arguments

    const concat = (a, b) => [...a, ...b];
    concat([1,2],[3,4]); // spread in arrays
})();

The spread syntax is also used in spread properties, a TC39 proposal that is a part of ECMAScript since 2018 allowing own enumerable properties of an object to be copied to another in a concise manner:

(() => {
    const A = { answer: 42 };
    const Q = { question: "?" };

    const QnA = { ...A, ...Q };

    console.log(QnA.question); // "?"
    console.log(QnA.answer); // 42
})();
386 questions
-1
votes
1 answer

Spread syntax for nested javascript object with dynamic properties for grouping

const data = [{year:2019,month:1,id:"xd1"}, {year:2019,month:1,id:"xd2"}, {year:2019,month:1,id:"xd4"}, {year:2019,month:2,id:"xd1"}, {year:2018,month:1,id:"rd3"}, {year:2018,month:2,id:"rd6"}, {year:2018,month:2,id:"rd7"} ] const result =…
silverfighter
  • 6,762
  • 10
  • 46
  • 73
-1
votes
3 answers

Convert array to object with key

I have an object as { ids: ['11', '12', '13', '14'], cat: 1 } I want to convert this to [ { id: '11', cat: 1 }, { id: '12', cat: 1 }, { id: '13', cat: 1 }, { id: '14', cat: 1 } ] Is it possible to do this single syntax?…
Saravanan S
  • 1,021
  • 1
  • 10
  • 24
-1
votes
1 answer

React - setState with spread operator return a proxy object

This is my code, i don't know why but the _onChangeValue function is always returning a proxy object instead of a simple string value. My this.state.values is a long object with a lot of properties, that's why i have to use the spread operator, the…
-1
votes
3 answers

Find largest adjacent product in array (JavaScript)

I'm trying to understand the following solution for finding the largest adjacent product in any given array. Example: For inputArray = [3, 6, -2, -5, 7, 3], the output should be adjacentElementsProduct(inputArray) = 21. 7 and 3 produce the…
ErnieandBert
  • 91
  • 1
  • 1
  • 8
-2
votes
2 answers

JavaScript spread object as function params

I am trying to spread an object to use as the parameters of a function. I'm pretty sure I've seen this done, but I cant remember how. I know how to do this with an array, but I need to do it with an object. Also, I can't just turn the object into an…
ToMakPo
  • 855
  • 7
  • 27
-2
votes
1 answer

What does ...this.somefunction() (invocation of a class function preceded by ellipsis) do in javascript in an object assignment?

Trying to understand a code snippet. What does ...this.savedSettings() do in the following snippet. afaik, ellipsis is used for destructuring and to pass variables to a function (spread syntax) constructor(props) { super(props); …
hyperbolicme
  • 29
  • 1
  • 8
-2
votes
2 answers

Inserting a new key-value pair to all objects in an array of objects without looping

I have an array of objects containing objects with similar structure. I need to add a new key value pair to all the objects in the array. How can I do it without looping the entire array. Providing an example of the output that I require, let arr =…
Dan Philip Bejoy
  • 4,321
  • 1
  • 18
  • 33
-2
votes
1 answer

Spread operator ES6 changing one field in an object in an array

case SET_WINE_ITEMS: const { index, name, value } = action.payload const items = state.items items[index][name] = value return { ...state, items } Is there a succinct way to use spread operators to implement the code above?
vedder
  • 1
  • 1
-3
votes
3 answers

What is the role of the spread operator in this javascript code?

Today I read this article in medium, and I don't understand about spread operator below. I know that the spread operator is used to receive array as a parameter in a function. In the code above, what does the spread operator do? Convert object to…
hje
  • 25
  • 5
-3
votes
1 answer

Understanding spread operator in JS

So I tried a simple example: const original = [ {id: 0, color: "red"}, {id: 1, color: "blue"} ] const copy = [...original] copy[0] = {id:2, color:"red"} copy[1].id = 2 console.log(original) console.log(copy) Results I…
MichaelK
  • 31
  • 4
-5
votes
1 answer

What does 3 dots actually do here

I saw a react component that has the state showed below: class MyComp extends BaseComponent { constructor(props) { super(props); this.state = { selectedColumns: [], params: { offset: 0, …
user1665355
  • 3,324
  • 8
  • 44
  • 84
1 2 3
25
26