Stack Overflow
Stack Overflow

Questions tagged [object-destructuring]

Use this tag for JavaScripts object destructuring syntax.

JavaScript object destructuring allows one to replace code like:

const object = {foo: 'bar', baz: 'bing'};
const foo = object.foo;
const baz = object.baz;

With this destructuring assignment syntax:

const object = {foo: 'bar', baz: 'bing'};
const {foo, baz} = object;
155 questions
46
votes
8 answers

Omit property variable when using object destructuring

Here is an example: const initObject = { a: 0, b: 0, c: 0 } const { a, ...rest } = initObject We're omitting property a from the object, but then const a is assigned a value, but never used - error from eslint (no-unused-vars). Is it…
Alexander Kim
  • 17,304
  • 23
  • 100
  • 157
31
votes
4 answers

Uncaught TypeError: Cannot destructure property `name` of 'undefined' or 'null'

Object destructuring throws error in case of null object is passed function test ({name= 'empty'}={}) { console.log(name) } test(null); Uncaught TypeError: Cannot destructure property name of 'undefined' or 'null'. at test (:1:15) …
rahlrokks
  • 451
  • 1
  • 4
  • 12
18
votes
3 answers

What is destructuring assignment and its uses?

I have been reading about Destructuring assignment introduced in ES6. What is the purpose of this syntax, why was it introduced, and what are some examples of how it might be used in practice?
Code Maniac
  • 37,143
  • 5
  • 39
  • 60
15
votes
2 answers

Destructure object parameter, but also have reference to the parameter as an object?

With ES6 you can destructure objects in function arguments: ({name, value}) => { console.log(name, value) } The equivalent ES5 would be: function(params) { console.log(params.name, params.value) } But what if I would like a reference both to the…
webketje
  • 10,376
  • 3
  • 25
  • 54
12
votes
3 answers

Object spread an Error results in no message property

I'm trying to spread an Error so that I can alter the error without affecting the original error. const error = new Error('Error test'); const freeError = {...error}; console.log(error, freeError); But the output is an empty object {}. I'm…
SnekNOTSnake
  • 1,157
  • 12
  • 24
11
votes
4 answers

Is it possible to destructure an object into existing variables?

I am trying to extract variables using object destructuring but those variables already exist, something like this const x=1, y=2 // Those should be 1 and 2 const {x,y} = complexPoint const point = {x,y} Is there any way to do this without renaming…
Juan Caicedo
  • 1,425
  • 18
  • 31
10
votes
4 answers

Destructure/access a property that may or may not exist on an object union type

I get the following errors: type Union = { type: "1"; foo: string } | { type: "2"; bar: number }; function doSomething = (object: Union) => { const { foo } = object // ^ TS2339: Property 'foo' does not exist on type 'Union'. …
Michal Kurz
  • 1,592
  • 13
  • 41
8
votes
1 answer

Equal sign inside object destructuring curly braces

I saw this statement in Graphql directive definition: const { resolve = defaultFieldResolver } = field; I know the part const { resolve } = field; means getting resolve property of the field object out and storing it in a local variable resolve.…
MuhammadAbdullah
  • 83
  • 5
8
votes
1 answer

JS object destructuring without defining variable names

When destructuring objects in ES6 JS, you can use the { a, b } syntax in order to create new variables, called a and b respectively, from that object. However, as far as I can tell, there is no way to get the keys of the object to automatically…
Matt Fletcher
  • 8,182
  • 8
  • 41
  • 60
6
votes
0 answers

Prettier settings to format object-destructuring until end of the line, instead of new line for every property

instead of this do this It could take only 2 lines not making my file longer than needed.
Rastislav Uhrin
  • 150
  • 1
  • 7
6
votes
1 answer

Why is this JavaScript not interpreted as a code block when semi-colon is used?

In Chrome version ^72 if I run the following JavaScript there are no errors. { prop: p } = { prop: 'prop' } >> { prop: 'prop' } So the line of code is interpreted as an expression statement, unexpectedly. But if I run the same code with a…
Adam Thompson
  • 3,278
  • 3
  • 22
  • 37
5
votes
2 answers

What's the JavaScript syntax to cast and destructure a param?

This seems like a stupid question. Say I have a function which accepts an object. How can I cast that object as props, but also destructure props.id to id (in the parameter declaration)? function go ({ id }) { const props = arguments[0]; // how…
neaumusic
  • 10,027
  • 9
  • 55
  • 83
4
votes
0 answers

Can I configure how VSCode autocompletes JSDoc?

VSCode lets me autocomplete a JSDoc when I start typing /** which is nice, and it even fills in some params. But a) it defaults all the params to * and b) it doesn't help when I'm destructuring an object in a function definition. e.g. if I had const…
AncientSwordRage
  • 7,086
  • 19
  • 90
  • 173
4
votes
1 answer

React js rename & destructure array length

I have a reduce function like below: let el = scopes.reduce ((tot, {actions}) => tot + actions.length, 0); I tried to transform it like this, but it seems that it is not the correct way: let el = scopes.reduce ((tot, {actions.length: len}) => tot +…
Paul
  • 3,644
  • 9
  • 47
  • 113
4
votes
1 answer

How can we apply method along with object destructuring?

I have one complex object and want to extract some keys and apply some function and assign it with some other variable name and using object destructuring syntax but couldn't find any solution to apply. const alpha = { a: 'lower', b: '23.45'…
xkeshav
  • 53,360
  • 44
  • 177
  • 245
1
2 3
…
10 11