टाइपस्क्रिप्ट में परिवर्तनीय और अपरिवर्तनीय
यह लेख टाइपस्क्रिप्ट में परिवर्तनीय और अपरिवर्तनीय अवधारणाओं की व्याख्या करता है।
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 ऐरे अपरिवर्तित रहता है, यह एक अपरिवर्तनीय (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 केवल एक सतही ठहराव (shallow 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)
पूरी तरह से अपरिवर्तनीय ऑब्जेक्ट बनाने के लिए एक गहन ठहराव (deep freeze) की आवश्यकता होती है।
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)
सारांश
- परिवर्तनीय (mutable) डेटा संशोधित किया जा सकता है, और इसमें ऑब्जेक्ट्स और ऐरे सम्मिलित होते हैं।
- अपरिवर्तनीय (immutable) डेटा संशोधित नहीं किया जा सकता है, और इसमें स्ट्रिंग्स और नंबर जैसे प्रिमिटिव प्रकार सम्मिलित होते हैं।
- स्प्रेड सिंटैक्स या
mapजैसी विधियों का उपयोग करके, अपरिवर्तनीय डेटा संचालन किया जा सकता है। Object.freezeऔरdeepFreezeका उपयोग ऑब्जेक्ट्स में संशोधन को रोकने के लिए किया जा सकता है।- अपरिवर्तनीय डेटा का उपयोग अधिक पूर्वानुमान योग्य और त्रुटिरहित कोड लिखने में मदद करता है।
एक अपरिवर्तनीय डिज़ाइन अपनाने से कोड की सुरक्षा और पठनीयता में सुधार होता है, इसलिए इसका पूरा उपयोग करें!
आप हमारे YouTube चैनल पर Visual Studio Code का उपयोग करके ऊपर दिए गए लेख के साथ आगे बढ़ सकते हैं। कृपया YouTube चैनल को भी देखें।