1

I ran into a strange case today using TypeScript (v3.5.1) that's left me puzzled. I defined an interface with an optional property but TypeScript allowed me to set the default to whatever I want when using object destructuring:

interface IFoo {
    letter?: "a" | "b" | "c";
}

const foo: IFoo = {};

const { letter = 1 } = foo;

console.log(letter); // --> 1
                     // Type signature of `letter`: "a" | "b" | "c" | 1
                     // Why does TS modify the type to include 1?

Run this code in the TypeScript playground.

Using some type inspection I noticed that TypeScript is modifying the expected signature of "a" | "b" | "c" to "a" | "b" | "c" | 1. I was expecting to get a type error when I tried to default letter to 1. Am I missing something here? Thanks!

1
  • Your expectation isn't warranted since you are declaring a new local variable. Furthermore, the behavior you expect would be detrimental. Commented Aug 16, 2019 at 1:00

2 Answers 2

2

The destructuring statement is introducing a new variable. It doesn't yet have a type unless one is assigned or in this case inferred.

Looking at the downcompiled code this becomes even more apparent:

// const { letter = 1 } = foo;
var _a = foo.letter, letter = _a === void 0 ? 1 : _a;

Or to clean it up a bit:

const letter = foo.letter === undefined ? 1 : foo.letter;

letter is either foo.letter or 1 if the former is undefined.

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

1 Comment

Yep. You are creating a new variable named letter. There is no rule that it has to have the same type as foo.letter
0

That is the default behavior. If you want to prevent that and get an error, you should type the destructuring:

const { letter = 1 } : IFoo = foo; // "IFoo" added, this should show the error: Type '1' is not assignable to type '"a" | "b" | "c"'

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.