سلام دوستان امیدوارم خوب باشید و همیشه درحال یادگیری🧑‍💻. همینطور که میدونید توی تایپ اسکریپت از Type و Interface برای تعیین تایپ متغیر ها استفاده میشه، اما چه تفاوت هایی با همدیگه دارند؟ توی این پست بررسی می‌کنیم.

1. ادغام interface های هم‌نام (Declaration merging)

زمانی که دو تا interface با یک نام تعریف می‌کنیم، تایپ اسکریپت این دو interface رو با همدیگه ادغام میکنه.

interface Person {
  name: string
}

interface Person {
  age: number
}

const john: Person = {
  name: "John",
  age: 26,
}

اما زمانی که دو تا Type یکسان تعریف کنیم، کامپایلر ارور میده.

type Person = {
  name: string
}

// This gives Duplicate identifier 'Person' error
type Person = {
  age: number
}

2. ارث بری و ادغام (Extends and Intersection)

یک ویژگی خوب interface ها این هست که به سادگی میتونند از کلاس ها یا حتی تایپ ها ارث بری کنند و یک interface توسعه یافته از اون درست کنیم.

interface PersonNameInterface { name: string }
interface Person1 extends PersonNameInterface { age: number }

type PersonNameType = { name: string }
interface Person2 extends PersonNameType { age: number }

class PersonClass { name = "Jhon" }
interface Person3 extends PersonClass { age: number }

ولی در Type ها ما ارث بری نداریم.

اما ما میتونیم چندین تایپ رو با & ترکیب کنیم و از ادغام اینها تایپ جدید تولید کنیم (در مورد interface ها این موضوع صادق نیست).

type PersonNameType = { name: string; }
type Person1 = PersonNameType & { age: number; }

interface PersonNameInterface { name: string; }
type Person2 = PersonNameInterface & { age: number; }

// We can combine two interfaces to create intersection type but cannot create intersection interfaces
interface PersonNameInterface { name: string; }
interface PersonAgeInterface { age: number; }
type Person3 = PersonNameInterface & PersonAgeInterface

3. Implements and Union

توی توسعه کلاس ها ما نمی‌تونم از Type های چند مقداری (Union) استفاده کنیم، بخاطر اینکه تایپ کلاس یا interface باید مشخص و ثابت باشد.

interface PersonInterface {
 name: string;
 age: number;
}

class John implements PersonInterface {
 name = "John";
 age = 26;
}

type PersonType = {
 name: string;
 age: number;
};

class Ann implements PersonType {
 name = "Ann";
 age = 26;
}

type UnionType = { name: string; } | { age: number; };

// Gives an error
class Joel implements UnionType {
 name = "Joel";
 age = 2;
}

اما در Type برعکس این هست و امکان چند مقداری (Union) وجود دارد.

type PersonNameType = {
 name: string
};

type PersoneAgeType = {
 age: number
};

type Person1 = PersonNameType | PersoneAgeType;

interface PersonNameInterface {
 name: string
};

interface PersoneAgeInterface {
 age: number
};

type Person2 = PersonNameInterface | PersoneAgeInterface;

4. سایر تایپ ها

از Type می‌تونیم در tuples,primitives,unions استفاده کنیم، اما با Interface ها همچین امکانی نیست.

// primitive
type Name = string;

// object
type PersonName = { name: string; };
type PersonAge = { y: number; };

// union
type PartialPoint = PersonName | PersonAge;

// tuple
type Data = [number, string];

در نهایت بهتر هست از Type داخل فانکشن های پیچیده، تایپ های پیچیده و... استفاده کرد.

و Interface رو برای آبجکت ها یا اگر نیاز به Declaration merging داشتیم استفاده کنیم.

---

خوب بچه ها امیدوارم این قسمت براتون مفید بوده باشه. خوشحال میشم اگه انتقادی یا پیشنهادی دارید برام بنویسید تا محتوای بهتری تولید بشه ❤️

منبع:

• https://blog.bitsrc.io/type-vs-interface-in-typescript-cf3c00bc04ae