javaScript - Map

키, 값 쌍

키 중복 X

순서 O

Map Methods

Method	Description
new Map()	Creates a new Map
set()	Sets the value for a key in a Map
get()	Gets the value for a key in a Map
delete()	Removes a Map element specified by the key
has()	Returns true if a key exists in a Map
forEach()	Calls a function for each key/value pair in a Map
entries()	Returns an iterator with the [key, value] pairs in a Map
size(Property)	Returns the number of elements in a Map

 

 

 

new Map()

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

document.getElementById("demo").innerHTML = fruits.get("apples");
</script>

500

 

 

 

set()

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map();

// Set Map Values
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);

document.getElementById("demo").innerHTML = fruits.get("apples");
</script>

500

 

 

 

get()

fruits.get("apples");    // Returns 500

 

 

 

 

 

delete()

fruits.delete("apples");

 

 

 

 

has()

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

document.getElementById("demo").innerHTML = fruits.has("apples");
</script>

true

 

 

 

 

 

Objects vs Maps

물체지도반복 가능크기키 유형키 순서기본값

	Object	Map
반복 가능	직접 반복할 수 없음	직접 반복 가능
크기	크기 속성이 없습니다.	크기 속성이 있습니다.
키 유형	키는 문자열(또는 기호)이어야 합니다.	키는 모든 데이터 유형이 될 수 있습니다.
키 순서	키가 잘 정렬되지 않음	키는 삽입순으로 정렬됩니다.
기본값	기본 키 있음	기본 키가 없음

 

 

 

forEach()

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

let text = "";
fruits.forEach (function(value, key) {
  text += key + ' = ' + value + "<br>"
})

document.getElementById("demo").innerHTML = text;
</script>

apples = 500
bananas = 300
oranges = 200

 

 

 

 

entry()

<p id="demo"></p>

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

let text = "";
for (const x of fruits.entries()) {
  text += x + "<br>";
}

document.getElementById("demo").innerHTML = text;
</script>

apples,500
bananas,300
oranges,200