What do square brackets mean in a type definition in Typescript

0 votes

In this Q/A, I have seen a union type definition wrapped into square brackets (edit: the question has been fixed by now). So far, I've only seen union types without square brackets. What is the difference between e.g.:

type UnionA = number | string;
type UnionB = [number | string];
Jun 16, 2022 in TypeSript by Logan
• 2,140 points
3,179 views

1 answer to this question.

0 votes

I've missed a basic type of TypeScript: Tuples.

So the semantics of UnionA and UnionB are different:

let x: UnionA = 0      // works
let x: UnionA = ""     // works
let x: UnionB = 0      // doesn't work
let x: UnionB = ""     // doesn't work
let x: UnionB = [0]    // works
let x: UnionB = [""]   // works

Basically UnionB is a tuple of length 1 with its first element being a union of number | string.

In retrospect, the linked question most likely

  • didn't mean to use [] to get the plain union type, or
  • was intended to use , instead of | to get a meaningful tuple with multiple fields.
answered Jun 22, 2022 by Nina
• 3,060 points

Related Questions In TypeSript

0 votes
0 answers

What is a type in Typescript for the Component class in Angular 2+?

I have a small problem, but big ...READ MORE

Jul 5, 2022 in TypeSript by Logan
• 2,140 points
758 views
0 votes
1 answer

What does the ! (exclamation mark) do in TypeScript?

The exclamation mark is called the non-null ...READ MORE

answered Jun 1, 2022 in TypeSript by Nina
• 3,060 points
1,156 views
0 votes
1 answer

What does the @ (at sign) sign do in TypeScript?

The big news this week is the ...READ MORE

answered Jun 10, 2022 in TypeSript by Nina
• 3,060 points
1,107 views
0 votes
1 answer

How can I define a type for a CSS color in TypeScript?

There was a proposal for a type of ...READ MORE

answered Jun 15, 2022 in TypeSript by Nina
• 3,060 points
4,321 views
0 votes
1 answer

How to set meta tags using Angular universal SSR and ngx-seo plug-in?

first Install the plug-in with npm i ngx-seo ...READ MORE

answered Feb 11, 2022 in Others by narikkadan
• 63,600 points
2,235 views
0 votes
1 answer

Can't bind to 'ngModel' since it isn't a known property of 'input'

Just add this in the app.module.ts file: import { FormsModule ...READ MORE

answered Apr 30, 2022 in Other DevOps Questions by narikkadan
• 63,600 points
4,485 views
0 votes
1 answer

VS Code enforces semicolons, but why doesn't Angular and TypeScript not use it consistently?

JavaScript has a syntactic feature known as semicolon ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
4,871 views
0 votes
1 answer

Square brackets around vs after expression in Typescript

x is an Array, while y is a Tuple. The ...READ MORE

answered Jun 7, 2022 in TypeSript by Nina
• 3,060 points
3,796 views
0 votes
1 answer

How do I extend a TypeScript class definition in a separate definition file?

If you don't have control over the ...READ MORE

answered Jun 10, 2022 in TypeSript by Nina
• 3,060 points
2,731 views
0 votes
1 answer

What is "not assignable to parameter of type never" error in TypeScript?

All you have to do is define ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
57,609 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP