जावास्क्रिप्ट मानचित्र

विषय - सूची

इस ट्यूटोरियल में, आप उदाहरणों की मदद से जावास्क्रिप्ट मैप्स और वेकमैप के बारे में जानेंगे।

जावास्क्रिप्ट ईएस 6 ने दो नई डेटा संरचनाएं पेश की हैं, अर्थात Mapऔर WeakMap

मानचित्र जावास्क्रिप्ट में वस्तुओं के समान है जो हमें तत्वों को कुंजी / मूल्य जोड़ी में संग्रहीत करने की अनुमति देता है ।

मानचित्र के तत्वों को सम्मिलन क्रम में डाला जाता है। हालाँकि, किसी ऑब्जेक्ट के विपरीत, एक मैप में ऑब्जेक्ट्स, फ़ंक्शंस और अन्य डेटा प्रकार प्रमुख हो सकते हैं।

जावास्क्रिप्ट मानचित्र बनाएँ

A बनाने के लिए Map, हम new Map()कंस्ट्रक्टर का उपयोग करते हैं । उदाहरण के लिए,

 // create a Map const map1 = new Map(); // an empty map console.log(map1); // Map ()

मैप में आइटम डालें

एक नक्शा बनाने के बाद, आप set()इसमें तत्वों को सम्मिलित करने के लिए विधि का उपयोग कर सकते हैं । उदाहरण के लिए,

 // create a set let map1 = new Map(); // insert key-value pair map1.set('info', (name: 'Jack', age: 26)); console.log(map1); // Map ("info" => (name: "Jack", age: 26))

आप चाबियों के रूप में वस्तुओं या कार्यों का उपयोग भी कर सकते हैं। उदाहरण के लिए,

 // Map with object key let map2 = new Map(); let obj = (); map2.set(obj, (name: 'Jack', age: "26")); console.log(map2); // Map (() => (name: "Jack", age: "26"))

पहुंच तत्वों का उपयोग करें

आप विधि Mapका उपयोग करके तत्वों तक पहुंच सकते हैं get()। उदाहरण के लिए,

 let map1 = new Map(); map1.set('info', (name: 'Jack', age: "26")); // access the elements of a Map console.log(map1.get('info')); // (name: "Jack", age: "26")

नक्शा तत्वों की जाँच करें

has()यदि तत्व किसी मानचित्र में है, तो आप यह जांचने के लिए विधि का उपयोग कर सकते हैं । उदाहरण के लिए,

 const set1 = new Set((1, 2, 3)); let map1 = new Map(); map1.set('info', (name: 'Jack', age: "26")); // check if an element is in Set console.log(map1.has('info')); // true

तत्वों को निकालना

आप clear()और delete()मैप से तत्वों को निकालने के लिए विधि का उपयोग कर सकते हैं ।

delete()विधि रिटर्न trueएक निर्दिष्ट मुख्य / मान जोड़े मौजूद है और हटा दिया गया है या फिर रिटर्न यदि false। उदाहरण के लिए,

 let map1 = new Map(); map1.set('info', (name: 'Jack', age: "26")); // removing a particular element map1.delete('address'); // false console.log(map1); // Map ("info" => (name: "Jack", age: "26")) map1.delete('info'); // true console.log(map1); // Map ()

clear()विधि एक मानचित्र वस्तु से सभी कुंजी / मान जोड़े को हटा। उदाहरण के लिए,

 let map1 = new Map(); map1.set('info', (name: 'Jack', age: "26")); // removing all element map1.clear(); // false console.log(map1); // Map ()

जावास्क्रिप्ट मानचित्र का आकार

आप sizeसंपत्ति का उपयोग करके मानचित्र में तत्वों की संख्या प्राप्त कर सकते हैं। उदाहरण के लिए,

 let map1 = new Map(); map1.set('info', (name: 'Jack', age: "26")); console.log(map1.size); // 1

एक नक्शे के माध्यम से Iterate

आप लूप या forEach () विधि का उपयोग करके मैप तत्वों के माध्यम से पुनरावृति कर सकते हैं। तत्वों को सम्मिलन क्रम में पहुँचा जाता है। उदाहरण के लिए,

 let map1 = new Map(); map1.set('name', 'Jack'); map1.set('age', '27'); // looping through Map for (let (key, value) of map1) ( console.log(key + '- ' + value); )

आउटपुट

 नाम- जैक उम्र- 27

आप forEach()विधि का उपयोग करके उपरोक्त कार्यक्रम के समान परिणाम भी प्राप्त कर सकते हैं । उदाहरण के लिए,

 // using forEach method() let map1 = new Map(); map1.set('name', 'Jack'); map1.set('age', '27'); // looping through Map map1.forEach(function(value, key) ( console.log(key + '- ' + value) ))

नक्शा कुंजी पर ओवररेट करें

आप मानचित्र पर पुनरावृति कर सकते हैं और keys()विधि का उपयोग करके कुंजी प्राप्त कर सकते हैं । उदाहरण के लिए,

 let map1 = new Map(); map1.set('name', 'Jack'); map1.set('age', '27'); // looping through the Map for (let key of map1.keys()) ( console.log(key) )

आउटपुट

 नाम उम्र

मैप वैल्यू पर Iterate

आप मानचित्र पर पुनरावृति कर सकते हैं और values()विधि का उपयोग करके मान प्राप्त कर सकते हैं । उदाहरण के लिए,

 let map1 = new Map(); map1.set('name', 'Jack'); map1.set('age', '27'); // looping through the Map for (let values of map1.values()) ( console.log(values); )

आउटपुट

 जैक २ 27

मानचित्र की कुंजी / मूल्य प्राप्त करें

आप मानचित्र पर पुनरावृति कर सकते हैं और entries()विधि का उपयोग करके मानचित्र की कुंजी / मान प्राप्त कर सकते हैं । उदाहरण के लिए,

 let map1 = new Map(); map1.set('name', 'Jack'); map1.set('age', '27'); // looping through the Map for (let elem of map1.entries()) ( console.log(`$(elem(0)): $(elem(1))`); )

आउटपुट

 नाम: जैक उम्र: 27

जावास्क्रिप्ट मानचित्र बनाम वस्तु

नक्शा वस्तु
Maps can contain objects and other data types as keys. Objects can only contain strings and symbols as keys.
Maps can be directly iterated and their value can be accessed. Objects can be iterated by accessing its keys.
The number of elements of a Map can be determined by size property. The number of elements of an object needs to be determined manually.
Map performs better for programs that require the addition or removal of elements frequently. Object does not perform well if the program requires the addition or removal of elements frequently.

JavaScript WeakMap

The WeakMap is similar to a Map. However, WeakMap can only contain objects as keys. For example,

 const weakMap = new WeakMap(); console.log(weakMap); // WeakMap () let obj = (); // adding object (element) to WeakMap weakMap.set(obj, 'hello'); console.log(weakMap); // WeakMap (() => "hello")

When you try to add other data types besides objects, WeakMap throws an error. For example,

 const weakMap = new WeakMap(); // adding string as a key to WeakMap weakMap.set('obj', 'hello');
 // throws error // TypeError: Attempted to set a non-object key in a WeakMap

WeakMap Methods

WeakMaps है तरीकों get(), set(), delete(), और has()। उदाहरण के लिए,

 const weakMap = new WeakMap(); console.log(weakMap); // WeakMap () let obj = (); // adding object (element) to WeakMap weakMap.set(obj, 'hello'); console.log(weakMap); // WeakMap (() => "hello") // get the element of a WeakMap console.log(weakMap.get(obj)); // hello // check if an element is present in WeakMap console.log(weakMap.has(obj)); // true // delete the element of WeakMap console.log(weakMap.delete(obj)); // true console.log(weakMap); // WeakMap () 

WeakMaps नहीं चलने योग्य हैं

मैप्स के विपरीत, WeakMaps चलने योग्य नहीं हैं। उदाहरण के लिए,

 const weakMap = new WeakMap(); console.log(weakMap); // WeakMap () let obj = (); // adding object (element) to WeakMap weakMap.set(obj, 'hello'); // looping through WeakMap for (let i of weakMap) ( console.log(i); // TypeError )

जावास्क्रिप्ट Mapऔर ES6WeakMap में पेश किए गए थे । कुछ ब्राउज़र उनके उपयोग का समर्थन नहीं कर सकते हैं। अधिक जानने के लिए, जावास्क्रिप्ट मैप समर्थन और जावास्क्रिप्ट कमजोर समर्थन पर जाएँ।

दिलचस्प लेख...