Spread operator
A spread operator is syntax that unpacks a collection’s elements or an object’s properties into individual values within an expression or function call.
Essential TypeScript 5, Third Edition
Spread syntax is JavaScript syntax that expands the properties or elements of an existing object or iterable into a new expression.
- How it is used
- Uses spread to supply function arguments, combine arrays, copy or adjust object properties, and turn map values into a filterable array.
- How deep it goes
- Works through array and object expressions, property override order, and one typed collection method; does not develop a broader implementation model.
- Examples
- Shows product names and prices combined or passed to a function, object properties added or replaced, and to-do items filtered from a map.
- What you can do after
- Apply it via JavaScript and TypeScript syntax to expand arrays or object properties and convert typed map values for filtering.
Read how Essential TypeScript 5, Third Edition explains spread operator →
Get Programming with JavaScript Next: New features of ECMAScript 2015, 2016, and beyond
A JavaScript operator form that expands an iterable or object into individual elements or properties in an expression or argument list.
- How it is used
- Ungroups iterable values for function arguments and array construction, including calls to `Math.min`.
- How deep it goes
- Explains argument expansion, array construction, copying, and rest contrast through examples; leaves iterator mechanics to the broader iterable treatment.
- Examples
- Uses marketplace prices, duplicate-finding calls, string-to-array expansion, cart updates, and an infinite-iterable exercise.
- What you can do after
- Apply it to pass iterable items as arguments or assemble arrays, while avoiding spread on an infinite iterable.
React Quickly, Second Edition
The spread operator is a JavaScript syntax feature that expands the properties of an object or elements of an iterable into another expression.
- How it is used
- Pass object properties through JSX elements and React components, especially when forwarding optional element attributes.
- How deep it goes
- Defines object expansion, rest destructuring, ordering, and practical cautions without examining language internals.
- Examples
- Uses Post property forwarding, input props, and a MenuItem that forwards target and id to an anchor.
- What you can do after
- Apply it in JSX to forward selected or remaining component properties while avoiding irrelevant attributes and accidental overrides.
Read how React Quickly, Second Edition explains spread operator →
Related concepts
- arrayproduces · An array is an indexed, ordered collection of elements arranged in one or more dimensions, with elements accessed by position.
- rest operatorcontrasts with · In JavaScript, rest syntax uses three dots to collect remaining function arguments, array elements, or object properties into a single binding.
- iterableuses · An iterable is an object or value that provides or supports a protocol for producing its elements sequentially.
- maximumuses · A maximum is the greatest value in a set under a specified ordering, or the greatest value permitted by a specified constraint.
- object literaluses · An object literal is a language expression that directly specifies an object value and its constituent properties or values.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.