I Cannot Believe TypeScript Recommends You Do This!

The TypeScript documentation is definitely not as good as it could be, but one thing that blows my mind is their recommendation of using interfaces over types. Types are more powerful in nearly every way which is why I love them and in this video I explain all the differences between types and interfaces and why you should probably be using types.

📚 Materials/References:

🌎 Find Me Here:

⏱️ Timestamps:

00:00 - Introduction
00:40 - Which is best
01:20 - Creating types/interfaces
02:10 - Reason #1
03:26 - Reason #2
05:14 - Interface myth
05:48 - Interface benefit #1

#TypeVsInterface #WDS #TypeScript

[mattpocockuk]

Hey Kyle! Loving all the TS content coming out of your channel.

Wanted to drop by with a clarification that probably ALSO needs to be on my types vs interfaces video.

When we're talking about performance with types vs interfaces, the difference is negligible when just declaring basic object types. The real performance gap is between intersections (&) and 'extends'. There is a pretty big gulf in performance between them - intersections are bloody hard for TS to resolve and so take a lot longer. Using extends is much easier and also comes with some correctness guarantees. I've seen a lot of folks in the community moving towards interfaces for that reason - interface extends really can speed up your TS codebase by a large factor.

I also neglected to mention this in my types vs interface video, it's a nasty little nuance that isn't clear on first look.

Love your stuff as always!

[asifurrahman]

To be very honest, this debate is completely unnecessary for me, I have used both, but I never found i have a huge problem just because i use interface, not type and vice versa.

[MichaelCampbell]

Having come from "classical" OO languages, I tend to use Types for when a thing "IS-A" other_thing. Interfaces are for when a thing "BEHAVES-LIKE" other thing. In other words, use the 2 styles for what your things are, or they do, not based on the capabilities necessarily. Sometimes you have to, of course.

[raellawrence]

I'm not convinced. I generally use interfaces for objects, and types for single liners like primitives or utility types. I find they play well together and don't see the issue with mixing them any more than mixing variable types.

[GLawSomnia]

If having to use types and interfaces together in the same codebase is your biggest problem then you are really having a sweet life

[jerondiovis]

1. Types intersection is NOT equal to extending interfaces.
Intersect two types like { name: string } & { name: number } an see what happens.
And happens "{ name: never }" instead of an error. Good luck tracking that in a project with more or less big types structure.
2. Types for some reason have an implicit index signature, which will bite you when you less expect it. When you denied to pass "just an object" to your func, for example, because that object "does not have an index signature", suddenly.

Overall, this whole video sounds like "oh, I cannot use same syntax for two totally different tools with different tasks, so I'll use just one of them". What kind of arguing is that? Please don't do this.

[MaksuelBoni]

I got your point, but i prefer to use Type like a "primitive" and Interface to describe an object.
and... To use OR with interface, you just need to declare 2 or more interfaces and call after, like:

interface A {
a: string
}
interface B {
b: number
}

const obj: A | B ....

🙃

[soviut]

There's nothing complicated about using both types and interfaces in a code base; they each serve a specific purpose. Just like there's nothing complicated about having some variables that are strings and others that are numbers; you use them where they're appropriate, you don't try to homogenized everything to strings. The only issue new developers face is knowing WHEN to use type or interface; telling them to "just use types" does them a huge disservice.

[nelsone]

Well… interfaces are meant to be used for objects. You don't actually need to rewrite an interface to be a non-object representation. You can actually use | and & for interfaces:

const response: IErrorResponse | ISuccessResponse = ...

Or using a type to alias them:

type Response = IErrorResponse | ISuccessResponse

const response: Response

----
I only use type for aliases in these cases. But for objects representation, I often prefer using interfaces to mix with classes and implements.

[chaws]

Another benefit of interfaces over types is that errors are so much easier to read. With types, it just spits out every property name which can get crazy when there are a lot of props, wheras with interfaces it just shows the interface name. I tend to use types more than interfaces, but I am torn on the issue because of the error messaging.

[adnanal-beda]

Interfaces are made to represent objects and DTOs.
Types are made to make few types work as close as primative types, but it can go as complex as you need.

[johnconnor]

You should definitely read about what interfaces are used for

[dough-pizza]

For me interfaces should be used when you want to expose a consistent API and make something open to extension but closed to modification where as use types for stuff you return from methods or functions

For example, a database call to fetch a user by ID should return a user *type* but a class responsible for calling the database should implement an *interface*

[AntonioRipa]

I think that the core point is missing. Type describes the properties of an object, interface describes the behaviors.
Said that, your choice is driven by this difference. Just my two cents

[KaSSa__]

One thing you don't mention about the benefits of interfaces over types is that interfaces are more OOP while types are more useful to share data around. Interfaces can have functions that are defined to have patterns that are predictable in your code base where the responsibilities are split between your views and your business logic. But, of course, in the front-end, it has less importance as you're mainly just sharing data around your components.

[MrSnailwood]

declaration merging can be really handy for exposing interface types from a library, especially when merging with a namespace declaration, e.g.

export interface User { ... }
export namespace User {
export is(obj: any): obj is User { .... }
}

[chriskennedy]

I use interfaces to enforce the shape of classes.

[jsmunroe]

I'm originally an OOP programmer and so I like to use inheritance. I like to define interfaces that can extend each other.

[TylerTraverse]

Simply advocating to use types everywhere because it's one unified thing across your codebase is not the best argument. That's like saying "we'll always use `let` because you can do more than with `const`, so if you only use `const` you'll have to switch some to `let` and then you'll have a mix of `let` and `const` in your code".

[gulpdiator]

You should always go interface first because its more readable, declarative and it inherits. Perfect for classes and objects, an arrays can use enums. Then there are generics, extremely powerful in interfaces where usually my custom type starts. But you do you.