টাইপস্ক্রিপ্ট প্রোগ্রামিংয়ে সেরা অনুশীলনসমূহ
এই প্রবন্ধটি টাইপস্ক্রিপ্ট প্রোগ্রামিংয়ের সেরা অনুশীলনসমূহ ব্যাখ্যা করে।
এই নির্দেশিকাটি টাইপস্ক্রিপ্টের টাইপ সুবিধা নিয়ে বাগ কমানো ও আরও পাঠযোগ্য কোড লেখার জন্য ব্যবহারিক সেরা অনুশীলন ব্যাখ্যা করে।
YouTube Video
টাইপস্ক্রিপ্ট প্রোগ্রামিংয়ে সেরা অনুশীলনসমূহ
টাইপস্ক্রিপ্টের সবচেয়ে বড় সুবিধা হল 'টাইপ ব্যবহার করে বাগ প্রতিরোধ করা এবং কোডের উদ্দেশ্য স্পষ্ট করা'।
সেরা অনুশীলনসমূহ কেবল নিয়ম নয় বরং নিরাপদ, পাঠযোগ্য ও রক্ষণাবেক্ষণযোগ্য কোড লেখার জন্য কিছু নীতিমালার সমন্বয়। নিচে আমরা ব্যবহারিক উদাহরণসহ বহুল ব্যবহৃত টাইপস্ক্রিপ্ট অনুশীলনসমূহ তুলে ধরছি।
any এড়িয়ে যান এবং সবসময় টাইপের অর্থবহ সংজ্ঞা দিন
প্রথমত, চলুন 'any' এড়িয়ে অর্থবহ টাইপ দেওয়ার বিষয়টি দেখি।
any টাইপ চেকিং সম্পূর্ণরূপে নিস্ক্রিয় করে, যা টাইপস্ক্রিপ্ট ব্যবহারের মূল উদ্দেশ্য হারিয়ে ফেলে। কেবল ফাংশন করতে any ব্যবহারের পরিবর্তে, যতটা সম্ভব বিস্তারিত টাইপ সংজ্ঞা দেওয়া গুরুত্বপূর্ণ।
1// Bad
2function parse(data: any) {
3 return data.value;
4}এই কোডটি যে কোনো মান গ্রহণ করতে পারে, তাই রানটাইম ত্রুটি প্রতিরোধ করা যায় না।
1// Good
2type ParsedData = {
3 value: string;
4};
5
6function parse(data: ParsedData): string {
7 return data.value;
8}টাইপ সংজ্ঞায়িত করার মাধ্যমে ইনপুট ও আউটপুটের উদ্দেশ্য স্পষ্ট হয় এবং নিরাপত্তা বাড়ে।
সবসময় type বা interface ব্যবহার করে অবজেক্ট স্ট্রাকচার স্পষ্টভাবে নির্ধারণ করুন।
পরবর্তী, চলুন 'type' অথবা 'interface' ব্যবহার করে সব সময় স্পষ্টভাবে অবজেক্ট স্ট্রাকচার নির্ধারণ করার বিষয়টি দেখি।
আকস্মিকভাবে অবজেক্ট ব্যবহার করলে তাদের গঠন অস্পষ্ট হয়ে যেতে পারে। পুনরায় ব্যবহারযোগ্যতা ও রক্ষণাবেক্ষণের জন্য সবসময় টাইপ আলাদা করুন।
1// Bad
2function createUser(user: { name: string; age: number }) {
3 console.log(user.name);
4}ছোটো কোডের ক্ষেত্রেও টাইপ আলাদা করার অভ্যাস গড়ে তোলা গুরুত্বপূর্ণ।
1// Good
2type User = {
3 name: string;
4 age: number;
5};
6
7function createUser(user: User): void {
8 console.log(user.name);
9}টাইপগুলোর নাম দিলে পুরো কোডবেস বোঝা অনেক সহজ হয়।
সম্ভাব্য সমস্ত অবস্থা সঠিকভাবে প্রকাশ করতে ইউনিয়ন টাইপ ব্যবহার করুন।
আপনি যদি শর্তে কাঁচা string বা number ব্যবহার করেন, অপ্রীতিকর মান চলে আসতে পারে। ইউনিয়ন টাইপ ব্যবহার করলে, আপনি টাইপ স্তরে শুধুমাত্র অনুমোদিত অবস্থাগুলো প্রকাশ করতে পারেন।
1// Bad
2function setStatus(status: string) {
3 console.log(status);
4}এই কোডে, অর্থহীন স্ট্রিং বা ভুল মানগুলো কম্পাইল সময়ে শনাক্ত করা যায় না।
1// Good
2type Status = "idle" | "loading" | "success" | "error";
3
4function setStatus(status: Status): void {
5 console.log(status);
6}ইউনিয়ন টাইপ ব্যবহার করলে, আপনি কম্পাইল সময়ে 'অসম্ভব অবস্থা' নির্ভরযোগ্যভাবে সরিয়ে ফেলতে পারবেন। ফলে, শর্তাধীন ব্রাঞ্চের নিরাপত্তা এবং কোডের নির্ভরযোগ্যতা বৃদ্ধি পায়।
null ও undefined স্পষ্টভাবে হ্যান্ডল করুন।
পরবর্তী, চলুন 'null' ও 'undefined' স্পষ্টভাবে হ্যান্ডল করার বিষয়টি দেখি।
টাইপস্ক্রিপ্টে, মান না থাকার সম্ভাবনা টাইপে প্রকাশ করা গুরুত্বপূর্ণ। আপনি যদি বিষয়টি অস্পষ্ট রাখেন, তবে রানটাইম ত্রুটির ঝুঁকি থাকে।
1type User = {
2 name: string;
3 email?: string;
4};email নাও থাকতে পারে, তাই সে হিসাবেই হ্যান্ডল করতে হবে।
1function printEmail(user: User): void {
2 if (user.email) {
3 console.log(user.email);
4 }
5}ঐচ্ছিক মান ব্যবহারের আগে অবশ্যই যাচাই করুন।
টাইপ অ্যাসারশন (as) শুধুমাত্র চরম প্রয়োজনে ব্যবহার করুন।
পরবর্তী, চলুন টাইপ অ্যাসারশন অতিরিক্ত ব্যবহার না করার বিষয়টি দেখি।
টাইপ অ্যাসারশন সাময়িকভাবে TypeScript-এর টাইপ যাচাই এড়িয়ে বলে, 'আমি জানি এই মানটি এই টাইপেরই'। অতিরিক্ত ব্যবহার টাইপ নিরাপত্তা দুর্বল করে।
1// Bad
2const value = input as string;এই কোডে, প্রকৃত মানটি স্ট্রিং না হলেও কোনো ভুল দেখায় না, যার ফলে রানটাইমে সমস্যা হতে পারে। নিচের কোডে দেখানো মতে, প্রথমে টাইপ গার্ড ব্যবহার করে নিরাপদভাবে যাচাই করার পদ্ধতি গ্রহণ করুন।
1// Good
2function isString(value: unknown): value is string {
3 return typeof value === "string";
4}
5
6if (isString(input)) {
7 console.log(input.toUpperCase());
8}টাইপ গার্ড হল একটি পদ্ধতি, যা আসল মান যাচাই করার সময় নিরাপদভাবে টাইপ নির্ধারণ করতে সাহায্য করে। টাইপ অ্যাসারশনের চেয়ে টাইপ গার্ডকে অগ্রাধিকার দিলে রানটাইম ত্রুটি সহজেই প্রতিরোধ করা যায়।
রিটার্ন টাইপের জন্য খুব বেশি টাইপ ইনফারেন্সের ওপর নির্ভর করবেন না।
পরবর্তী, চলুন রিটার্ন টাইপের জন্য ইনফারেন্সের উপর অতিরিক্ত নির্ভর না করার বিষয়টি দেখি।
টাইপস্ক্রিপ্টের টাইপ ইনফারেন্স শক্তিশালী, তবে পাবলিক ফাংশনের রিটার্ন টাইপ নির্দিষ্ট করা আরও নিরাপদ। এটি ভবিষ্যতের পরিবর্তনের সম্ভাব্য প্রভাব কমায়।
1// Bad
2function sum(a: number, b: number) {
3 return a + b;
4}ছোট ফাংশনেও আপনার উদ্দেশ্য স্পষ্টভাবে জানান।
1// Good
2function sum(a: number, b: number): number {
3 return a + b;
4}রিটার্ন টাইপ সংজ্ঞায়ন API-এর স্থায়িত্ব বাড়ায়।
unknown ব্যবহার করে ইনপুট নিরাপদভাবে হ্যান্ডল করুন।
পরবর্তী, চলুন 'unknown' ব্যবহার করে বাহ্যিক ইনপুট নিরাপদে গ্রহণ করার বিষয়টি দেখি।
API, JSON, অথবা ইউজার ইনপুটের মতো বাহ্যিক ইনপুটের জন্য, any-এর বদলে unknown ব্যবহার করুন। এভাবে করলে, আপনি নিশ্চিত করতে পারবেন যে সব মান যাচাই করা হয়েছে এবং টাইপ নিরাপত্তা বজায় থাকবে।
1// Bad
2function handleResponse(data: any) {
3 console.log(data.id);
4}unknown দিয়ে টাইপ কীভাবে যাচাই করবেন তা এখানে দেখানো হলো।
1// Good
2function handleResponse(data: unknown): void {
3 if (
4 typeof data === "object" &&
5 data !== null &&
6 "id" in data
7 ) {
8 console.log((data as { id: number }).id);
9 }
10}unknown সরাসরি ব্যবহার করা যায় না; এটি যাচাই করা আবশ্যক এমন একটি টাইপ। বাহ্যিক ইনপুট ব্যবহারের সময় এটি বিশেষভাবে কার্যকর।
ছোট ছোট টাইপ একত্র করে প্রকাশক্ষমতা বাড়ান।
পরবর্তী, চলুন ছোট ছোট টাইপ একত্রিত করে প্রকাশক্ষমতা বাড়ানোর বিষয়টি দেখি।
একসাথে বড় টাইপ সংজ্ঞায়ন পাঠযোগ্যতা ও রক্ষণাবেক্ষণযোগ্যতা কমিয়ে দেয়। আপনার টাইপগুলোকে অর্থবহ অংশে ভাগ করুন ও প্রয়োজনে একত্র করুন।
1type Id = number;
2
3type UserProfile = {
4 id: Id;
5 name: string;
6};
7
8type UserWithStatus = UserProfile & {
9 status: "active" | "inactive";
10};টাইপকে কম্পোনেন্ট হিসেবে নিলে ডিজাইন গোছানো সহজ হয়।
type এবং interface
interface-এর সুবিধাসমূহ
type ও interface দুটোই টাইপ সংজ্ঞায়িত করতে পারে, তবে তাদের ব্যবহারের উদ্দেশ্য ও বৈশিষ্ট্য আলাদা। সঠিক ভূমিকার জন্য এগুলো ব্যবহার করলে টাইপ সংজ্ঞার উদ্দেশ্য আরও স্পষ্ট হয়।
1// Bad
2type User = {
3 id: number;
4 name: string;
5};
6
7type AdminUser = {
8 id: number;
9 name: string;
10 role: "admin";
11};এভাবে সাধারণ অংশ বারবার ব্যবহার করলে কোড পরিবর্তনের জন্য দুর্বল হয়ে যায়।
1// Good
2interface User {
3 id: number;
4 name: string;
5}
6
7interface AdminUser extends User {
8 role: "admin";
9}interface এক্সটেনশন (extends) জড়িত ডিজাইনের জন্য আদর্শ এবং অবজেক্টের 'গঠন' প্রকাশের জন্য সবচেয়ে উপযুক্ত।
type-এর সুবিধাসমূহ
অন্যদিকে, type আরও প্রকাশক্ষম এবং ইউনিয়ন ও ইন্টারসেকশন টাইপ ব্যবস্থাপনার জন্য উপযোগী।
1// Good
2type Status = "idle" | "loading" | "success" | "error";
3
4type ApiResponse<T> =
5 | { status: "success"; data: T }
6 | { status: "error"; message: string };type অবস্থা, বিকল্প বা সংমিশ্রণ প্রকাশের জন্য ভালো।
type এবং interface-এর মধ্যে নির্বাচন করার জন্য নির্দেশিকাসমূহ
আঙ্গুলের নিয়ম হিসেবে, অবজেক্ট স্ট্রাকচার ও কন্ট্র্যাক্টের জন্য interface এবং ইউনিয়ন, ইন্টারসেকশন বা টাইপ অপারেশন দরকার হলে type ব্যবহার করুন।
উভয়ই প্রায় একইভাবে কাজ করে, তবে টাইপের অস্তিত্বের কারণ পরিষ্কার করার দিক থেকে নির্বাচন করা জরুরি।
আপনার টাইপকে ডকুমেন্টেশন হিসেবে বিবেচনা করুন।
সবশেষে, চলুন ডকুমেন্টেশন হিসেবে টাইপ লেখার বিষয়ে দেখি।
ভালো টাইপ সংজ্ঞা মন্তব্যের চেয়েও বেশি তথ্য প্রকাশ করে। 'টাইপের দিকে তাকিয়ে স্পেসিফিকেশন বোঝা যায়'— এমন একটি অবস্থার দিকে লক্ষ্য রাখা গুরুত্বপূর্ণ।
1type ApiError = {
2 code: number;
3 message: string;
4 retryable: boolean;
5};এইভাবে, টাইপস্ক্রিপ্টের প্রধান শক্তিগুলোর মধ্যে একটি হলো টাইপ ডেফিনিশন স্পেসিফিকেশন ডকুমেন্ট হিসেবে কাজ করতে পারে।
সারসংক্ষেপ
টাইপস্ক্রিপ্টের সেরা অনুশীলন অতি কঠোরতা নিয়ে নয়। মূল হলো, টাইপের মাধ্যমে উদ্দেশ্য স্পষ্ট করা এবং পরিবর্তনের জন্য শক্তিশালী কোড লেখা।
প্রতিদিনের ডেভেলপমেন্টে ছোট ছোট নিয়ম অনুসরণ করলে, দীর্ঘমেয়াদে 'সহজ রিভিউ', 'কম বাগ' এবং 'নিজের বা অন্যের জন্য আরও ভালো বোঝাপড়া'র মতো সুবিধা পাবেন।
প্রথমেই ভাবুন 'এটি কীভাবে টাইপ দিয়ে প্রকাশ করতে পারি?', তাহলে উচ্চমানের টাইপস্ক্রিপ্ট-স্টাইল কোড লিখতে পারবেন।
আপনি আমাদের ইউটিউব চ্যানেলে ভিজ্যুয়াল স্টুডিও কোড ব্যবহার করে উপরের নিবন্ধটি অনুসরণ করতে পারেন। দয়া করে ইউটিউব চ্যানেলটিও দেখুন।