"Destructuring allows you to bind a set of variables to a corresponding set of values anywhere that you can normally bind a value to a single variable" ("Common Lisp the Language").
Questions tagged [destructuring]
1338 questions
27
votes
6 answers
React hooks: How do I update state on a nested object with useState()?
I have a component that receives a prop that looks like this:
const styles = {
font: {
size: {
value: '22',
unit: 'px'
},
weight: 'bold',
color: '#663300',
family: 'arial',
…

codemon
- 1,456
- 1
- 14
- 26
27
votes
3 answers
ES6 Destructuring assignment with `this`
The code below works. Is there a way that is more convenient, if possible even a one-liner?
const { nextUrl, posts } = await postService.getCommunityPosts(6);
this.communityPosts = posts;
this.nextUrl = nextUrl;
I know about giving destructured…

sandrooco
- 8,016
- 9
- 48
- 86
27
votes
2 answers
Destructure a map in another map?
I have the following data structure:
{:file #, :resolution {:width 1280, :height 1024}}
I would like to write a function that destructures the :resolution key into width and height symbols. Something like
(defn to-directory-name…

Tim Visher
- 12,786
- 16
- 58
- 66
27
votes
6 answers
What is the shortest way to modify immutable objects using spread and destructuring operators
I'm looking for a pure function, to modify my immutable state object. The original state given as parameter must stay untouched. This is especially useful when working with frameworks like Redux and makes working with immutable object in javascript…

Tarion
- 16,283
- 13
- 71
- 107
26
votes
5 answers
Destructuring array of objects in es6
In es6, how can i simplify the following lines using destructuring?:
const array0 = someArray[0].data;
const array1 = someArray[1].data;
const array2 = someArray[2].data;

ssss
- 303
- 1
- 4
- 7
26
votes
1 answer
Can I use destructuring assignment with immutable.js?
With standard JS objects, one can use destructuring assignment such as:
let obj = {name: 'james', code: '007'}
let {name, code} = obj // creates new variables 'name' and 'code' (with the proper values)
As suggested by some Flux / Redux evangelist,…

Tomas Kulich
- 14,388
- 4
- 30
- 35
26
votes
1 answer
Destructure parameter of a Clojure function while keeping the original value.
Can you destructure a function parameter but still have the original available for use? The way I'm doing it now is just using a let form inside the function body, but I wondering if there was a terser way of doing it.

Ilia Choly
- 18,070
- 14
- 92
- 160
25
votes
3 answers
Combining the Parameter Properties shorthand with Destructuring in TypeScript
EDIT
I logged an issue on TypeScript's Github repo and they're accepting PRs for implementing it.
In TypeScript, when we want to automatically create properties in our class from the constructor definition, we can take advantage of the Parameter…

Buzinas
- 11,597
- 2
- 36
- 58
24
votes
3 answers
Is there a way to both destructure a function parameter, and keep a named reference to the parameter?
In react stateless functional components we'll commonly write something like this:
export function MyCompoment({
title,
foo,
bar
}) {
return
title: {title}, ...
}
Where we're immediately destructuring the props object…
dwjohnston
- 11,163
- 32
- 99
- 194
22
votes
5 answers
ES6 double destructure
I understand this probably is a pretty basic question, but I'm not proficient with ES6 and I've encountered this syntax:
const { rootStore: { routerStore } } = this.props;
I understand what something like this means:
const { rootStore } =…

Avi
- 21,182
- 26
- 82
- 121
21
votes
4 answers
Why no destructing in def form?
In a let form (Clojure here) I can doing something like
(let [[u s v] (svd A)]
(do-something-with u v))
where svd returns a list of length three. This is a very natural sort of thing to do, so why isn't that we don't we have
(def [u s v] (svd…

Gabriel Mitchell
- 979
- 5
- 17
21
votes
1 answer
ES6 destructuring two objects with same property name
i have two javascript object with the next syntax:
let section = { name: "foo", tables: [] }
let field = { name: "bar", properties: {} }
and a function who expect those objects, but in the function i only use the name of each object, so i wanted…

Carlos Herrera Plata
- 973
- 8
- 21
20
votes
2 answers
Suppress unused variable error for destructured arrays
I'm destructuring the result of a regex match
function getStuffIWant(str: string): string {
const [
fullMatch, // [ts] 'fullMatch' is declared but its value is never read.
stuffIWant,
] = str.match(/1(.*)2/);
return…

Sandy Gifford
- 7,219
- 3
- 35
- 65
19
votes
7 answers
Assign multiple variables at once with dynamic variable names
I'm aware I can assign multiple variables to multiple values at once with:
(foo, bar, baz) = 1, 2, 3
And have foo = 1, bar = 2, and so on.
But how could I make the names of the variables more dynamic? Ie,
somefunction(data,tupleofnames):
…

mikemaccana
- 110,530
- 99
- 389
- 494
19
votes
4 answers
cannot read property of null doing destructing
Destructing is cool but I start to encounter serious issues when doing destructing of nested objects. I have this code:
const {
credit: { amont },
} = userProfile
This is dangerous because what if credit is null? the whole app breaks. How…

Hoknimo
- 533
- 2
- 6
- 15