টাইপস্ক্রিপ্টে পরিবর্তনশীল এবং অপরিবর্তনীয়

টাইপস্ক্রিপ্টে পরিবর্তনশীল এবং অপরিবর্তনীয়

এই নিবন্ধটি টাইপস্ক্রিপ্টে পরিবর্তনশীল এবং অপরিবর্তনীয় ধারণাগুলি ব্যাখ্যা করে।

YouTube Video

টাইপস্ক্রিপ্টে পরিবর্তনশীল এবং অপরিবর্তনীয়

পরিবর্তনশীল কি?

পরিবর্তনশীল মানে এমন একটি মান যা পরিবর্তিত হতে পারে। অবজেক্ট এবং অ্যারের মতো রেফারেন্স টাইপ গুলি পরিবর্তনশীল ডেটা স্ট্রাকচারের সাধারণ উদাহরণ।

পরিবর্তনশীল অবজেক্টের উদাহরণ

1type Person = { name: string; age: number };
2
3// Mutable Example: Object
4let person: Person = { name: "Alice", age: 25 };
5person.age = 26;
6console.log(person); // { name: "Alice", age: 26 }

এই কোডে, person অবজেক্টের age প্রপার্টি 25 থেকে 26 এ পরিবর্তিত হয়েছে। যেহেতু অবজেক্টগুলি রেফারেন্স দ্বারা পাস করা হয়, তাই person ভেরিয়েবলে সংরক্ষিত মেমরি ঠিকানার বিষয়বস্তু পরিবর্তিত হয়।

পরিবর্তনশীল অ্যারের উদাহরণ

1// Mutable Example: Array
2let numbers: number[] = [1, 2, 3];
3numbers.push(4);
4console.log(numbers); // [1, 2, 3, 4]

এই কোডে, push মেথডের মাধ্যমে আসল অ্যারেতে একটি নতুন এলিমেন্ট 4 যোগ করা হয়েছে। এটি আসল অ্যারে পরিবর্তন করে, যা এটিকে একটি পরিবর্তনশীল অপারেশন করে তোলে।

একটি ফাংশনের মধ্যে উদাহরণ

1// Mutable Example: Function
2function append(arr: number[], value: number): void {
3    arr.push(value); // Modify the original array
4    console.log(arr);
5}
6
7let nums: number[] = [1, 2, 3];
8append(nums, 4);
9console.log(nums); // [1, 2, 3, 4]

যখন একটি ফাংশনের মধ্যে পরিবর্তনশীল অপারেশন করা হয়, তখন আসল অ্যারেটিও পরিবর্তিত হয়।

অপরিবর্তনীয় কি?

অপরিবর্তনীয় মানে একটি মান পরিবর্তিত করা যাবে না।প্রিমিটিভ টাইপগুলি মূলত অপরিবর্তনীয়।

অপরিবর্তনীয় প্রিমিটিভ টাইপের উদাহরণ

1// Immutable Example: String
2let str: string = "hello";
3str[0] = "H"; // Error: Index assignment is not allowed
4console.log(str); // "hello"

str স্ট্রিংটির প্রথম অক্ষরটি H দিয়ে পরিবর্তন করার চেষ্টা ব্যর্থ হয় কারণ স্ট্রিংগুলি অপরিবর্তনীয়

একটি ফাংশনের মধ্যে উদাহরণ

1// Immutable Example: Function
2function increment(num: number): number {
3    num++; // This modifies only the local copy of num
4    return num;
5}
6
7let number: number = 10;
8console.log(increment(number)); // 11
9console.log(number); // 10 (original number remains unchanged)

সংখ্যাগুলি অপরিবর্তনীয় হওয়ায়, ফাংশনের মধ্যে অপারেশনগুলি আসল ভেরিয়েবলে কোনো প্রভাব ফেলেনা।

অ্যারের উপর অপরিবর্তনীয় অপারেশন

অ্যারে সাধারণত পরিবর্তনশীল, তবে আসল অ্যারের পরিবর্তে একটি নতুন অ্যারে তৈরি করে, অপরিবর্তনীয় অপারেশন অর্জন করা যেতে পারে।

1// Create an array of numbers
2let numbers: number[] = [1, 2, 3];
3
4// Immutable Example: Creating a new array
5let newNumbers: number[] = [...numbers, 4];
6
7console.log(numbers); // [1, 2, 3] (original array is unchanged)
8console.log(newNumbers); // [1, 2, 3, 4] (new array with an added element)

এখানে, স্প্রেড সিনট্যাক্স (...) ব্যবহার করে একটি নতুন অ্যারে newNumbers তৈরি করা হয়। মূল numbers অ্যারেটি অপরিবর্তিত থাকে, তাই এটি একটি অপরিবর্তনীয় প্রক্রিয়া।

অপরিবর্তনীয় ডেটা কাঠামো ব্যবহারের উপকারিতা

উন্নত পূর্বানুমানযোগ্যতা

অপরিবর্তনীয় ডেটা পরিবর্তিত হয় না, ফলে অপ্রত্যাশিত পরিবর্তনের সম্ভাবনা কমে এবং বাগের সম্ভাবনাও হ্রাস পায়।

অপরিবর্তনীয়তার উপর ভিত্তি করে থাকা লাইব্রেরির সাথে সামঞ্জস্যতা

React এবং Redux এর মতো লাইব্রেরি প্রায়ই অপরিবর্তনীয় ডেটার উপর ভিত্তি করে ডিজাইন করা হয়, যা সঠিকভাবে ব্যবহার করলে স্টেট ম্যানেজমেন্ট সহজ করে।

Object.freeze এর মাধ্যমে অবজেক্ট অপরিবর্তনীয় করা

Object.freeze ব্যবহার করে একটি অবজেক্টে পরিবর্তন হতাশা প্রতিরোধ করা যায়।

1// Create a frozen object (properties cannot be modified)
2const person = Object.freeze({ name: "Alice", age: 25 });
3
4// Attempt to modify a property (ignored in non-strict mode, error in strict mode)
5person.age = 26;
6
7console.log(person); // { name: "Alice", age: 25 }

তবে, Object.freeze কেবল সামনের স্তরের ফ্রিজ প্রয়োগ করে, যার মানে নেস্টেড অবজেক্টের গুণাবলী পরিবর্তনযোগ্য থাকে।

1// Create a frozen object with a nested object
2const user: Readonly<{ profile: { name: string } }> = Object.freeze({
3    profile: { name: "Bob" }
4});
5
6// Attempt to modify a nested property (this works because Object.freeze() is shallow)
7user.profile.name = "Charlie"; // No TypeScript error, but still mutable
8
9console.log(user.profile.name); // "Charlie" (nested object is still mutable)

সম্পূর্ণ অপরিবর্তনীয় অবজেক্ট তৈরি করতে একটি ডীপ ফ্রিজ প্রয়োজন।

 1// Function to deeply freeze an object, making all nested objects immutable
 2function deepFreeze<T>(obj: T): Readonly<T> {
 3    Object.freeze(obj);
 4    Object.getOwnPropertyNames(obj).forEach(prop => {
 5        const value = (obj as any)[prop];
 6        if (typeof value === "object" && value !== null) {
 7            deepFreeze(value);
 8        }
 9    });
10    return obj;
11}
12
13// Create a deeply frozen object
14const user = deepFreeze({
15  profile: { name: "Bob" }
16});
17
18// Attempt to modify a nested property
19// (this will now throw an error in strict mode)
20user.profile.name = "Charlie";  // No TypeScript error, but modification is not allowed at runtime
21
22console.log(user.profile.name); // "Bob" (unchanged due to deep freeze)

সারসংক্ষেপ

  • পরিবর্তনযোগ্য ডেটা পরিবর্তন করা যায়, এবং এতে অবজেক্ট এবং অ্যারে অন্তর্ভুক্ত থাকে।
  • অপরিবর্তনীয় ডেটা অপরিবর্তনীয়, এবং এতে স্ট্রিংস এবং নাম্বারসের মতো প্রিমিটিভ ধরন অন্তর্ভুক্ত থাকে।
  • স্প্রেড সিনট্যাক্স বা map এর মতো পদ্ধতি ব্যবহার করে, অপরিবর্তনীয় ডেটা অপারেশন সম্পন্ন করা যায়।
  • Object.freeze এবং deepFreeze ব্যবহার করে অবজেক্টের পরিবর্তন প্রতিরোধ করা যায়।
  • অপরিবর্তনীয় ডেটা ব্যবহার করলে আরও পূর্বানুমানযোগ্য এবং কম ত্রুটি-প্রবণ কোড লেখা সহজ হয়।

অপরিবর্তনীয় ডিজাইনের গ্রহণ কোডের নিরাপত্তা এবং পাঠযোগ্যতা উন্নত করে, তাই এটিকে সম্পূর্ণভাবে ব্যবহার করুন!

আপনি আমাদের ইউটিউব চ্যানেলে ভিজ্যুয়াল স্টুডিও কোড ব্যবহার করে উপরের নিবন্ধটি অনুসরণ করতে পারেন। দয়া করে ইউটিউব চ্যানেলটিও দেখুন।

YouTube Video