Maps — தமிழ்

</>Coding Tamilan.← JavaScript course

JavaScript · Lesson 27 / 32 · தமிழ்

Maps

கருத்தைப் புரிந்துகொள்ளுங்கள். Code-ஐ மாற்றி இயக்குங்கள். ஒரு சிறிய பயிற்சியால் கற்றதை உறுதி செய்யுங்கள்.

Detailed notesRunnable JavaScriptPractice + answer

மூலப் பாட விளக்கங்கள் தமிழில் உள்ளன. கூடுதல் concept, practice மற்றும் answer notes ஆங்கிலத்தில் உள்ளன.

01 / Understand

முக்கியக் கருத்து

Map stores key/value entries and supports keys beyond strings. Use get and set rather than ordinary object property syntax.

Learning goal: Explain what the example does, predict its result, and change it to solve the practice task.

02 / Explore

விரிவான விளக்கங்கள்

JavaScript-ல Map

Map என்பது key-value pairs-ன் collection — keys எந்த type-உம் ஆகலாம் (strings மட்டும் இல்ல). Insertion order maintain பண்ணும், iterable.

Map vs Object

FeatureMapObject
Key typesஎந்த type-உம் (objects, functions)Strings/symbols மட்டும்
OrderInsertion orderMostly insertion order
Sizemap.sizeObject.keys(obj).length
IterationDirectly iterableObject.keys() தேவை
JavaScript reference fragmentCODE
const map = new Map();

map.set("name", "Alice");
map.set(42, "the answer");
map.set(true, "boolean key");

console.log(map.get("name"));    // "Alice"
map.has("name");   // true
map.delete(42);
map.size;          // 2

for (const [key, value] of map) {
  console.log(key, value);
}

// Array-ல இருந்து initialize பண்றது
const map2 = new Map([["a", 1], ["b", 2]]);

map.clear();
03 / Read & predict

முழுமையான உதாரணம்

Run this complete index.js program in the JavaScript console editor below. The earlier reference fragments may need a browser page or other surrounding setup.

index.js · complete exampleCODE
const progress = new Map();
progress.set("Kavi", 3);
progress.set("Maya", 5);
console.log(progress.get("Kavi"));
console.log(progress.size);
for (const [name, count] of progress) console.log(name + ": " + count);
எதிர்பார்க்கும் முடிவைப் பாருங்கள்
3
2
Kavi: 3
Maya: 5
04 / Experiment

மாற்றி இயக்கிப் பாருங்கள்

Load the example, change a value, predict the output, and run it again. Use the console output to check your reasoning.

Open editor ↗

Editor load ஆனதும் code-ஐ ஏற்றி Run அழுத்துங்கள்.

OneCompiler என்ற இலவச வெளிப்புற சேவை code-ஐ இயக்குகிறது. Run செய்யும் code அங்கு அனுப்பப்படும். தனிப்பட்ட தகவல்கள் அல்லது secret keys உள்ளிட வேண்டாம்.

05 / Your turn

சிறிய பயிற்சி

Practice challenge

Update Kavi to 4 and check size again.

விடை மற்றும் விளக்கம்

progress.set("Kavi", 4) updates the existing entry. size stays 2.

தவிர்க்க வேண்டிய தவறு: progress["Kavi"] is an ordinary property, not a Map entry. Use progress.get("Kavi").

அடுத்த பாடத்திற்குத் தயாரா?

  • Explain the example in your own words.
  • Complete the challenge before revealing its answer.
  • Describe the common mistake and how to avoid it.
Coding Tamilan · Learn by doing.