Interface vs Type Alias
interface
আর type alias
— দুটোই TypeScript এ custom type define করতে ব্যবহৃত হয়। কিন্তু capability ও ব্যবহার (use case) আলাদা।
Interface: কী এবং কখন ব্যবহার করবো?
Basic Concept:
Interface একটি blueprint বা contract তৈরি করে, যা বলে দেয় যে একটি object বা class এর মধ্যে কি কি properties এবং methods থাকতে হবে। কিন্তু interface নিজে কোনো কোড লিখে না — এটি শুধু একটি structure define করে।
interface
মূলত object এর structure বা shape define করতে ব্যবহৃত হয় যেমনঃ
interface User{
name: string;
age: number;
email: string
}
এখন আমরা চাইলে এই User
interface কে ব্যাবহার করতে পারবো যেমনঃ
interface User{
name: string;
age: number;
email: string
}
function getDetailsOfUser(userObj:User){
}
এখানে আমরা userObj এর টাইপ হিসেবে User interface কে ব্যবহার করেছি ।
Use Cases of Interface
কোন কোন ক্ষেত্রে আমরা Interface
কে ব্যবহার করবো তা নিয়ে চলো বিস্তারিত জানি ।
১. Object shape define করা
আমারা Interface
কে ব্যবহার করে অবজেক্ট এর সেইপ ডিফাইন করতে পারি এবং সেটা ব্যাবহার করতে পারি।
interface Product {
name: string;
image: string;
price: number;
}
// এখানে আমরা একটা কাস্টম অবজেক্ট এর সেইপ বানিয়েছি যাতে আমরা এটাকে পরে একটা টাইপ ডেফিনেশন হিসেবে ব্যবহার করতে পারি ।
const product: Product = {
name: "Example product",
image: "something.com",
price: 20,
};
// আমরা এখানে আমাদের বানানো অবজেক্ট এর সেইপ দিয়ে আমরা অবজেক্ট এর টাইপ ডিফাইন করতে পারছি ।
function getDetailsOfProduct(productObj: Product) {
return productObj.name;
}
// আবার আমরা এখানেও আমাদের বানানো অবজেক্ট এর সেইপ দিয়ে ফাংশন এর প্রপ্স এর টাইপ বলতে পারছি
getDetailsOfProduct(product);
২. Class implement করা
Interface
কে আমরা ক্লাস এ ইমপ্লিমেন্ট করতে পারি।
interface Animal {
sound(): void;
}
class Dog implements Animal {
sound() {
console.log("Woof!");
}
}
৩. অন্য interface inherit করা
একটা ইন্টারফেস অন্য আরেকটা ইন্টারফেস কে ইনহেরিট করতে পারে ।
interface Person {
name: string;
}
interface Employee extends Person {
employeeId: number;
}
৪. Declaration Merging
সেইম নামে দুইবার ইন্টারফেস ডিফাইন করলে সেটা অটোমেটিকেলি মার্জ হয়ে একটা ইন্টারফেস হয়ে যায় ।
interface Window {
customProp: string;
}
interface Window {
anotherProp: number;
}
// এখন Window = { customProp: string; anotherProp: number }
Type Alias: কী এবং কখন ব্যবহার করবো?
Basic Concept:
Type Alias TypeScript এ একধরনের নামকরণ কৌশল, যা কোনো একটি type বা complex structure-কে একটি name দিয়ে উল্লেখ করার সুযোগ দেয়। এটি মূলত কোনো type বা interface এর বদলে একটি সহজ এবং সুন্দর নাম ব্যবহার করার জন্য কাজে আসে।
type
হলো একধরনের alias বা shortcut — যেকোনো টাইপকে এক নামে define করতে পারে।
যেমন আমরা যদি চাই যে, টাইপস্ক্রিপ্ট এর number
টাইপকে আমরা নাম্বার নামে না রেখে অন্য কোন নামে ব্যাবহার করব অথবা একটা কম্বিনেশন অফ টাইপ যেমন ঃ {name:string; age: number}
এটাকে একটা কমন নামে User
হিসেবে ধরবো তাহলে এটাকে বলা হয় Type Alias
।
type numberOfAge = number;
type User = {
name: string;
age: numberOfAge;
};
const persons: User = {
name: "Alex",
age: 30,
};
Use Cases of Type Alias
কোন কোন ক্ষেত্রে আমরা Type Alias
কে ব্যবহার করবো তা নিয়ে চলুন বিস্তারিত জানি ।
১. Union / Intersection তৈরি করা
আমরা টাইপ এলিয়াস ব্যাবহার করে কোন টাইপের ইউনিয়ন বা ইন্টারসেকশন বানাতে পারি।
- **Union:
|
মানে হলো যেকোন একটা হতে পারে আবার দুইটাও হতে পারে ** - Intersection:
&
মানে হলো দুইটাই হবে
type Status = "loading" | "success" | "error";
type Admin = { role: "admin" };
type Guest = { role: "guest" };
type User = Admin | Guest; // Union
type Name = { name: string };
type Age = { age: number };
type Person = Name & Age; // Intersection
২. Primitive, Tuple, Function টাইপ define করা
type ID = string | number;
type NameAge = [string, number]; // Tuple
type Greet = (name: string) => string; // Function type
৩. Generic Type Alias
type ApiResponse<T> = {
data: T;
error?: string;
};
const userResponse: ApiResponse<{ name: string }> = {
data: { name: "Rahim" }
};
Type দিয়ে complex type define করা (like API status)
type Status = "idle" | "loading" | "success" | "error";
function show(status: Status) {
if (status === "loading") console.log("Loading...");
}
Difference Between Interface and Type Alias
১. মৌলিক ধারণা (Basic Concept)
interface
মূলত object এর shape বা structure define করতে ব্যবহৃত হয়।
interface User {
name: string;
age: number;
}
type
যেকোনো টাইপ define করতে পারে — object, union, tuple, primitive, etc.
type User = {
name: string;
age: number;
};
২. Object Extend করা (Extending / Inheritance)
Interface: একাধিক interface কে extend করা যায়
interface Person {
name: string;
}
interface Employee extends Person {
employeeId: number;
}
Type: একাধিক type কে extend (intersect) করা যায়, &
দিয়ে
type Person = {
name: string;
};
type Employee = Person & {
employeeId: number;
};
দুইটাতেই extend করা যায়, তবে syntax আলাদা।
৩. Union এবং Intersection
Type: Union ও Intersection ভালোভাবে handle করতে পারে
type ID = string | number;
type Admin = { role: 'admin' };
type User = { role: 'user' };
type Person = Admin | User;
Interface: Union টাইপ define করতে পারে না
// এটা interface দিয়ে করা যাবে না
তাই type
ইউজ করো যখন union বা complex types লাগে।
৪. Declaration Merging
Interface: একাধিকবার declare করলে merge হয়ে যায়
interface Box {
height: number;
}
interface Box {
width: number;
}
// এখন Box = { height: number, width: number }
Type: একবার declare করার পর আবার করা যাবে না
type Box = {
height: number;
};
type Box = {
width: number;
}; // ❌ Error: Duplicate identifier
Library বানানোর সময় interface ভালো, কারণ declare merge করা যায়।
৫. Practical Example
Interface:
interface Car {
brand: string;
drive(): void;
}
Type:
type Car = {
brand: string;
drive: () => void;
};
দুইটাই কাজ করবে, কিন্তু interface structure define করার জন্য বেশি natural লাগে।
🔚 কোনটা কখন ব্যবহার করব?
Use Case | Recommendation |
---|---|
Object বা Class এর shape | Interface preferred |
Union, Intersection | Type preferred |
Function, Tuple, Primitive define করতে | Type |
Library বানানোর সময় | Interface (because of merging) |
Simplicity / Personal Preference | যেকোনোটা, তবে consistency maintain করো |
🔥 Final Tip:
তুমি যদি শুধু object structure define করো, তাহলে
interface
। যদি complex type composition, union/intersection লাগে, তাহলেtype
।