حالت های خاص interface در TypeScript

سلام، تو این پست میخوام بیشتر راجب interface ها توضیح بدم.

تو پست قبل (https://vrgl.ir/3i8s1) با مقدمات interface آشنا شدیم و کارکردش تو کلاس هارو دیدیم. تو این پست میخوام حالت های خاص استفاده از interface رو معرفی کنم که بیشتر باهاش آشنا بشیم.

🔸 استفاده Nested interface: قابلیت جالب Nested Interface به ما امکان قرار دادن interface ها در یکدیگر رو میده. بریم تو مثال ببینیم:

interface CSIntern {
    step: number;
    course: string;
}

interface Person {
    fullName: string;
    age: number;
    csintern?: CSIntern;
}

const ali: Person = {
    fullName: &quotAli Sadeghi&quot,
    age: 22,
    csintern: {
        step: 9,
        course: &quotWeb&quot,
    },
};

console.log(ali.csintern?.step); // 9

تو این مثال ما دو interface با اسم های CSIntern و Person تعریف کردیم و در interface Person متغیر اختیاری csintern رو ساختیم و خواستیم تایپش از نوع interface CSIntern باشه. جلوتر متغیر ali رو با تایپ interface Person ساختیم و بهش متغیر اختیاری csintern رو دادیم. در متغیر ali میتونیم مقدار های step و course رو اضافه کنیم چون interface CSIntern در متغیر csintern در interface Person استفاده شده. در نهایت با لاگ گرفتن ali.csintern?.step عدد 9 در کنسول نشون داده میشه.

🔸 استفاده از interface های همنام: میتونیم چند interface با نام های مثل هم داشته باشیم و کامپایلر TypeScript همه ی این interface هارو با هم merge میکنه درنهایت یک interface با اون اسم میشناسه. بریم تو مثال ببینیم:

interface CSIntern {
    step: number;
    course: string;
}

interface Person {
    fullName: string;
    age: number;
    csintern?: CSIntern;
}

const ali: Person = {
    fullName: &quotAli Sadeghi&quot,
    age: 22,
    csintern: {
        step: 9,
        course: &quotWeb&quot,
    },
};

console.log(ali.csintern?.step); // 9

تو این مثال دو interface با اسم های CSIntern تعریف کردیم و جلوتر متغیر ali رو با تایپ interface CSIntern ساختیم. میبینیم کامپایلر TypeScript اروری به کدمون نمیگیره و میتونیم در متغیر ali از هر دو متغیر step و course استفاده کنیم. انگار هر دو interface با هم merge شدن و ما یک interface با دو متغیر step و course داریم. در نهایت با لاگ گرفتن ali.step عدد 9 در کنسول نشون داده میشه.

#cs_internship

#step9

#web