JavaScript Maps

விசை-மதிப்பு ஜோடிகளின் தொகுப்பு

Map பொருள்

ஒரு JavaScript Map என்பது விசை-மதிப்பு ஜோடிகளின் தொகுப்புகளைச் சேமிக்கக்கூடிய ஒரு பொருளாகும், இது மற்ற நிரலாக்க மொழிகளில் உள்ள அகராதியைப் போன்றது.

Map விசுவலைசேஷன்

"apples"
500
"bananas"
300
"oranges"
200
"mangos"
100

விசை → மதிப்பு ஜோடிகள்

🗺️ முக்கிய வித்தியாசம்:

Maps நிலையான பொருள்களிலிருந்து வேறுபடுகின்றன, ஏனெனில் விசைகள் எந்த தரவு வகையிலும் இருக்கலாம் (சரங்கள், எண்கள், பொருள்கள், முதலியன).

Map பண்புகள்

விசை வகைகள்

Map விசைகள் எந்த வகையிலும் இருக்கலாம் (சரங்கள், எண்கள், பொருள்கள், முதலியன).

சேர்க்கும் வரிசை

Map விசைகளின் அசல் சேர்க்கும் வரிசையை நினைவில் வைத்திருக்கிறது.

அளவு

Map இல் உள்ள உருப்படிகளின் எண்ணிக்கை size பண்பைப் பயன்படுத்தி எளிதாக பெறப்படுகிறது.

செயல்திறன்

Maps விசை-மதிப்பு ஜோடிகளை அடிக்கடி சேர்த்தல் மற்றும் அகற்றுவதற்கு மேம்படுத்தப்பட்டுள்ளன.

மறு செய்கை

Maps மறு செய்கை செய்யக்கூடியவை, for...of சுழற்சிகள் அல்லது forEach() போன்ற முறைகளை நேரடியாகப் பயன்படுத்த அனுமதிக்கிறது.

மறு செய்கை வரிசை

மறு செய்கையின் போது அசல் வரிசை பாதுகாக்கப்படுகிறது.

📌 குறிப்பு:

Maps இரண்டு பொருள்களுக்கும் (தனித்த விசை/மதிப்பு தொகுப்பு) மற்றும் வரிசைகளுக்கும் (வரிசைப்படுத்தப்பட்ட மதிப்புகள் தொகுப்பு) ஒத்திருக்கின்றன.

ஆனால் நீங்கள் நெருக்கமாகப் பார்த்தால், Maps பொருள்களுக்கு மிகவும் ஒத்திருக்கின்றன.

Map ஐ எவ்வாறு உருவாக்குவது

நீங்கள் ஒரு JavaScript Map ஐ பின்வரும் வழிகளில் உருவாக்கலாம்:

Method 1

புதிய Map உருவாக்கி Map.set() மூலம் உறுப்புகளைச் சேர்த்தல்

const fruits = new Map();
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);

Method 2

ஏற்கனவே உள்ள வரிசையை new Map() கட்டமைப்பாளருக்கு அனுப்புதல்

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

Map மதிப்புகளைச் சேர்த்தல்

நீங்கள் set() முறையைப் பயன்படுத்தி ஒரு Map க்கு உறுப்புகளைச் சேர்க்கலாம்:

Example

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

fruits.set("mangos", 100);

Map மதிப்புகளை மாற்றுதல்

set() முறையை ஏற்கனவே உள்ள Map மதிப்புகளை மாற்றவும் பயன்படுத்தலாம்:

Example

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

fruits.set("apples", 200);  // "apples" இன் மதிப்பை 500 இலிருந்து 200 ஆக மாற்றுகிறது

get() முறை

get() முறை ஒரு Map இல் உள்ள ஒரு விசையின் மதிப்பைப் பெறுகிறது:

Example

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

fruits.get("apples");    // 500 தரும்
fruits.get("bananas");   // 300 தரும்
fruits.get("oranges");   // 200 தரும்

Maps பொருள்கள்

JavaScript இல், Maps பொருள்களாகும்:

typeof

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

typeof fruits;      // "object" தரும்

instanceof

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

fruits instanceof Map;  // true தரும்

JavaScript பொருள்கள் vs Maps

JavaScript பொருள்கள் மற்றும் Maps இடையேயான வேறுபாடுகள்:

அம்சம் பொருள் Map
மறு செய்கை நேரடியாக மறு செய்கை செய்ய முடியாது நேரடியாக மறு செய்கை செய்யக்கூடியது
அளவு size பண்பு இல்லை size பண்பு உள்ளது
விசை வகைகள் விசைகள் சரங்கள் (அல்லது சின்னங்கள்) ஆக இருக்க வேண்டும் விசைகள் எந்த தரவு வகையிலும் இருக்கலாம்
விசை வரிசை விசைகள் நன்கு வரிசைப்படுத்தப்படவில்லை விசைகள் சேர்க்கும் வரிசையால் வரிசைப்படுத்தப்படுகின்றன
இயல்புநிலை விசைகள் இயல்புநிலை விசைகள் உள்ளன இயல்புநிலை விசைகள் இல்லை

🔑 முக்கிய வேறுபாடு:

Map விசைகள் எந்த தரவு வகையிலும் இருக்கலாம், அதே நேரத்தில் பொருள் விசைகள் சரங்கள் அல்லது சின்னங்களாக மட்டுமே இருக்க வேண்டும்.

Maps பயிற்சி

JavaScript Maps இன் அடிப்படை கருத்துகளைப் புரிந்துகொள்வதை இந்த பயிற்சி சோதிக்கிறது.

Map க்கு உறுப்புகளைச் சேர்க்க எந்த முறையைப் பயன்படுத்தலாம்?

add()
✗ தவறு! Map இல் add() முறை இல்லை
insert()
✗ தவறு! Map இல் insert() முறை இல்லை
push()
✗ தவறு! push() வரிசைகளுக்கான முறை, Maps க்கு அல்ல
set()
✓ சரி! set() முறை Map க்கு உறுப்புகளைச் சேர்க்க அல்லது மாற்ற பயன்படுகிறது

மேலும் அறிய

Maps பற்றிய மேலும் விரிவான தகவலுக்கு:

JavaScript Map Methods

Map முறைகள் மற்றும் பண்புகள்

JavaScript Weak Maps

WeakMap மற்றும் அதன் பயன்பாடுகள்

JavaScript Map Reference

முழுமையான Map குறிப்பு

JavaScript Sets

Sets அறிமுகம் மற்றும் அடிப்படைகள்

உலாவி ஆதரவு

Map ஒரு ES6 அம்சமாகும்.

ES6 ஜூன் 2017 முதல் அனைத்து நவீன உலாவிகளிலும் முழுமையாக ஆதரிக்கப்படுகிறது:

உலாவி பதிப்பு வெளியீட்டு தேதி
Chrome 51 May 2016
Edge 15 Apr 2017
Firefox 54 Jun 2017
Safari 10 Sep 2016
Opera 38 Jun 2016