ohakutsu
@ohakutsu

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

TypeScriptのinterfaceとtypeの使い分けについて

Discussion

Closed

TypeScriptの interface と type について

TypeScriptにあるinterfacetypeには細かい違いはありますが、ほぼ同じように使うことが出来ると思います。(私のいる環境だけかもしれないです)
例えば、以下のコードのように、Propsinterfaceでもtypeでも宣言できます。

typescript
interface Props {
  ...
}
// ↑↓どちらでも動く
type Props = {
  ...
}

const hoge = (props: Props) => {
  ...
}

そこで、interfacetypeのどちらを使っても動作する場合、どちらを使っていますか?

最近の私の使い方

ちなみに私は下のコードのように、
interfaceは関数などに引数を渡すときなど、文字通りインターフェースとして、
typeは特定の型の宣言として使っています。

typescript
interface Props {
  user: User
}

type User = {
  ...
}

const hoge = (props: Props) => {
  const otherUsers: User[] = [...]
  ...
}

0
interface Hoge {
    name: string
}

type Fuga = {
    name: string
}

declare const fn: (rec: Record<string, unknown>) => void

declare const h: Hoge
declare const f: Fuga

// @ts-expect-error: 代入できない
fn(h)
// 代入できる
fn(f)

何かのインスタンスなら interface
ただのオブジェクト(prototype が Object)なら type
どちらでもないなら引数は interface、 返値や関数内変数は type にすると使いやすいのかなと思っています

0Like

interface で表せるなら interface
そうでないなら(Union 型など)は type ですね。

interface で表せるものを type で表す利点が分かりません。

type型エイリアス(別名)であるというのが本質だと思います。

1Like

Your answer might help someone💌