I have an object like this
const obj = [{a: 'a'}];
I can get it like:
const { a } = obj[0]; //a
but what if obj['x'] doesn't exist?
I tried this with optional chainning but doesn't seem to work.
const { a } = obj?.[1];
4 Answers
You are close to it. You should make sure to fallback with an empty object, for the destructing later to make sense
const obj = [{a: 'a'}];
const { a } = obj?.[1] || {};
console.log(a)Update
This would be even shorter if you don't use destructing in this case
const obj = [{a: 'a'}];
const a = obj?.[1]?.a; // or: obj?.[1]?.['a']
console.log(a)
8 Comments
Andreas
With
|| {} there's no need for optional chaining o.O
Roberto Zvjerković
@Andreas There is. Optional chaining is concerned with
obj being undefined, OR operator is concerned what will be returned with obj[1] if obj[1] is undefined.Andreas
@RobertoZvjerković "but what if obj['x'] doesn't exist?" - So
obj exists but obj.x may not. There's no need for optional chaining.
Judy Allen
what if I avoid using destructing?
const a = obj?.[1]?.a, do I still need a fallback?Roberto Zvjerković
@Andreas Except you will get a runtime error if you don't use optional chaining, and
obj doesn't exist |
You could festructure with an index as computed property and a default object for a missing item of the array.
const
obj = [{ a: 'a' }],
{ [2]: { a } = {} } = obj;
console.log(a);
1 Comment
Judy Allen
omg this is so complicated, what if I use multiple
? like const a = obj?.[1]?.aTake a look at the following three cases, where I've used optional chaining.
You need to first check if the first element of the array (index 0) exists and then check if there's a field a in it.
// Case 1:
const obj1 = [{ a: "a" }];
console.log(obj1?.[0]?.a); // "a"
// Case 2:
const obj2 = [{ b: "b" }];
console.log(obj2?.[0]?.a); // undefined
// Case 3:
const obj3 = [];
console.log(obj3?.[0]?.a); // undefined
answered Apr 16, 2021 at 8:46
Som Shekhar Mukherjee
8,1982 gold badges16 silver badges34 bronze badges
1 Comment
Som Shekhar Mukherjee
@JudyAllen Please check if this solves your problem, let me know if you have any issues.
You can use the Logical OR operator.
const { a } = obj[x] || {}
If obj does not have a property x, a will be set to undefined.
1 Comment
Judy Allen
will this shorter?
const a = obj?.[1]?.a
obj?.[1]returns just asundefinedasobj[1]would), you should either drop the destructuring and use a simple property access (with?.where needed) or use destructuring everywhere with default values.const a = obj?.[1]?.a