typescript optional chaining with object destructuring

Question

I've just updated typescript to 3.7.4 and I am trying to edit my code.

I have a simple code

interface Test
  event: {
    queryStringParameters: { [name: string]: string } | null;
  }
}
const test:Test = (event) => {
  // const { no } = event?.queryStringParameters; //Property 'no' does not exist on type '{ [name: string]: string; } | null'.ts(2339)
  const no = event?.queryStringParameters?.no; //It works but I want to use above that.
  ...
}

I want to use the optional chaining with destructuring.

Is it available feature now?

Terry · Accepted Answer · 2020-01-08 08:30:24Z

9

That is because queryStringParameters can be null, and the null object does not contain the property no. You will need to use a null coalescing operator for that:

const { no } = event?.queryStringParameters ?? { no: null };

Note that the ?? operator is currently only available via TypeScript 3.7+ is not yet a standard JS operator as of now. See related discussion on TypeScripts repo for more details: https://github.com/microsoft/TypeScript/issues/26578

answered Jan 8, 2020 at 8:30

Terry

66.7k16 gold badges107 silver badges127 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

typescript optional chaining with object destructuring

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related