জাভাস্ক্রিপ্টে পরিবর্তনযোগ্য এবং অপরিবর্তনযোগ্য
এই আর্টিকেলটি জাভাস্ক্রিপ্টে পরিবর্তনযোগ্য এবং অপরিবর্তনযোগ্য ধারণা ব্যাখ্যা করে।
YouTube Video
জাভাস্ক্রিপ্টে পরিবর্তনযোগ্য এবং অপরিবর্তনযোগ্য
পরিবর্তনযোগ্য কী?
পরিবর্তনযোগ্য অর্থ হল একটি মান পরিবর্তন করা যেতে পারে। অবজেক্ট এবং অ্যারে, যা রেফারেন্স টাইপ, তারা পরিবর্তনযোগ্য তথ্য কাঠামোর সাধারণ উদাহরণ।
পরিবর্তনযোগ্য অবজেক্টের উদাহরণ
1let person = { name: "Alice", age: 25 };
2person.age = 26;
3console.log(person); // { name: "Alice", age: 26 }
এই কোডে, person অবজেক্টের age প্রপার্টিটি ২৫ থেকে ২৬-এ পরিবর্তিত হয়েছে। যেহেতু অবজেক্টগুলো রেফারেন্স দ্বারা প্রেরণ করা হয়, তাই person ভেরিয়েবলে সংরক্ষিত মেমরি ঠিকানার বিষয়বস্তুটি পরিবর্তিত হয়।
পরিবর্তনযোগ্য অ্যারের উদাহরণ
1let numbers = [1, 2, 3];
2numbers.push(4);
3console.log(numbers); // [1, 2, 3, 4]
এই কোডে, মূল অ্যারেতে নতুন একটি উপাদান 4 যোগ করার জন্য push মেথড ব্যবহার করা হয়েছে। এটি মূল অ্যারেটি পরিবর্তন করে, যা এটিকে একটি পরিবর্তনযোগ্য অপারেশন করে তোলে।
একটি ফাংশনে উদাহরণ
1// Function to append a value to an array
2function append(arr, value) {
3 arr.push(value); // Modify the original array
4 console.log(arr);
5}
6
7let numbers = [1, 2, 3];
8append(numbers, 4);
9
10console.log(numbers); // [1, 2, 3, 4] (original array is modified)
যদি একটি ফাংশনের মধ্যে পরিবর্তনযোগ্য অপারেশনগুলি সম্পন্ন করা হয়, তবে মূল অ্যারেটিও পরিবর্তিত হয়।
অপরিবর্তনযোগ্য কী?
অপরিবর্তনযোগ্য অর্থ হল একটি মান পরিবর্তন করা যাবে না। প্রাথমিক টাইপগুলো মূলত অপরিবর্তনযোগ্য।
অপরিবর্তনযোগ্য প্রাথমিক টাইপের উদাহরণ
1let str = "hello";
2str[0] = "H";
3console.log(str); // "hello"
str স্ট্রিং-এর প্রথম অক্ষরটিকে H এ পরিবর্তন করার প্রচেষ্টা ব্যর্থ হয় কারণ স্ট্রিংগুলো অপরিবর্তনযোগ্য।
একটি ফাংশনে উদাহরণ
1// Function to increment a number
2function increment(num) {
3 num++; // This modifies only the local copy of num
4 console.log(num);
5}
6
7let number = 10;
8increment(number);
9
10console.log(number); // 10 (original number remains unchanged)
যেহেতু সংখ্যাগুলি অপরিবর্তনযোগ্য, একটি ফাংশনের ভেতরের অপারেশনগুলো মূল ভেরিয়েবলের উপর কোনো প্রভাব ফেলে না।
অ্যারেতে অপরিবর্তনযোগ্য অপারেশন
অ্যারে পরিবর্তনযোগ্য, তবে মূল অ্যারেটি পরিবর্তন করার পরিবর্তে একটি নতুন অ্যারে তৈরি করা অপরিবর্তনযোগ্য অপারেশন করতে দেয়।
1// Create an array of numbers
2let numbers = [1, 2, 3];
3
4// Create a new array by spreading the original and adding a new element
5let newNumbers = [...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 অ্যারে পরিবর্তিত হয়নি, এটি একটি অপরিবর্তনীয় (immutable) অপারেশন।
অপরিবর্তনীয় ডেটা স্ট্রাকচার ব্যবহারের সুবিধা
উন্নত পূর্বানুমানযোগ্যতা
কারণ অপরিবর্তনীয় ডেটা পরিবর্তন করা যায় না, অপ্রত্যাশিত পরিবর্তনের সম্ভাবনা কম, যা বাগের ঝুঁকি হ্রাস করে।
অপরিবর্তনযোগ্যতার উপর ভিত্তি করে লাইব্রেরিগুলির সাথে সামঞ্জস্যতা
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 = Object.freeze({ profile: { name: "Bob" } });
3
4// Attempt to modify a nested property (this works because Object.freeze() is shallow)
5user.profile.name = "Charlie";
6
7console.log(user.profile.name); // "Charlie" (nested object is still mutable)
একটি সম্পূর্ণ অপরিবর্তনীয় অবজেক্ট তৈরি করতে, একটি ডীপ ফ্রিজ প্রয়োজন।
1// Function to deeply freeze an object, making all nested objects immutable
2function deepFreeze(obj) {
3 Object.keys(obj).forEach(key => {
4 if (typeof obj[key] === "object" && obj[key] !== null) {
5 deepFreeze(obj[key]); // Recursively freeze nested objects
6 }
7 });
8 return Object.freeze(obj); // Freeze the top-level object
9}
10
11// Create a deeply frozen object
12const user = deepFreeze({ profile: { name: "Bob" } });
13
14// Attempt to modify a nested property (ignored)
15user.profile.name = "Charlie";
16
17console.log(user.profile.name); // "Bob" (unchanged due to deep freeze)
সারসংক্ষেপ
- পরিবর্তনযোগ্য (Mutable) ডেটা পরিবর্তন করা যায়, যার মধ্যে অবজেক্ট এবং অ্যারে অন্তর্ভুক্ত।
- অপরিবর্তনীয় (Immutable) ডেটা পরিবর্তন করা যায় না, যার মধ্যে স্ট্রিং এবং নাম্বারের মতো প্রিমিটিভ টাইপ অন্তর্ভুক্ত।
- স্প্রেড সিনট্যাক্স অথবা
mapব্যবহার করে অপরিবর্তনীয় ডেটা অপারেশন কার্যকর করা যায়।। Object.freezeএবংdeepFreezeঅবজেক্টে পরিবর্তন প্রতিরোধ করতে ব্যবহার করা যেতে পারে।- অপরিবর্তনীয় ডেটা ব্যবহার পূর্বানুমানযোগ্য এবং কম ত্রুটিপূর্ণ কোড নিশ্চিত করে।
অপরিবর্তনীয় ডিজাইন কোডের নিরাপত্তা এবং পাঠযোগ্যতা উন্নত করে, তাই এটি ভালোভাবে ব্যবহার করুন!
আপনি আমাদের ইউটিউব চ্যানেলে ভিজ্যুয়াল স্টুডিও কোড ব্যবহার করে উপরের নিবন্ধটি অনুসরণ করতে পারেন। দয়া করে ইউটিউব চ্যানেলটিও দেখুন।