Methods(메서드들)
new Map() – 맵을 만듬
map.set(key, value) – key를 이용해 value를 저장
map.get(key) – key에 해당하는 값을 반환함 (key가 존재하지 않으면 undefined를 반환)
map.has(key) – key가 존재하면 true, 존재하지 않으면 false를 반환.
map.delete(key) – key에 해당하는 값을 삭제
map.clear() – 맵 안의 모든 요소를 제거
map.size – 요소의 개수를 반환
Iteration(반복자)
map.keys() – key를 모은 iterable object를 반환
map.values() – value을 모은 iterable object를 반환
map.entries() – [key, value]을 한 쌍으로 하는 iterable object를 반환
ex04.html 파일을 다음과 같이 만듭니다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>javaScript Map</title>
<script>
let map = new Map([
['컴퓨터', 1500],
['마우스', 250],
['프린터', 800]
]);
// forEach사용하기
map.forEach((value, key)=>{
document.write(`${key} ${value}<br>`);
});
document.write(`<hr>`);
// map.has(key) – key가 존재하면 true, 존재하지 않으면 false를 반환.
document.write(`컴퓨터 ${map.has('컴퓨터') ? "있다" : "없다"}<br>`);
document.write(`모니터 ${map.has('모니터') ? "있다" : "없다"}<br>`);
document.write(`<hr>`);
// map.delete(key) – key에 해당하는 값을 삭제
map.delete('프린터');
map.forEach((value, key)=>{
document.write(`${key} ${value}<br>`);
});
document.write(`<hr>`);
// map.clear() – 맵 안의 모든 요소를 제거
map.clear();
document.write(`${map.size}개<hr>`);
// 키는 중복을 허용하지 않는다.
map.set(1,'한사람').set(2,'두사람').set(3,'세사람').set(1,'네사람');
document.write(`${map.size}개<hr>`);
map.entries().forEach(([key, value], index)=>{
document.write(` ${index}. ${key} : ${value}<br>`)
});
document.write(`<hr>`);
</script>
</head>
<body>
</body>
</html>
|
cs |
실행 결과 입니다.
'Front End > Javascript' 카테고리의 다른 글
| [JavaScript] 맵(Map) to string, string to Map (0) | 2024.10.23 |
|---|---|
| [JavaScript] 맵(Map) to Object, Object to Map (0) | 2024.10.23 |
| [JavaScript] 맵(Map)객체의 요소 반복하기 (0) | 2024.10.23 |
| [JavaScript] 맵(Map) 객체의 map[key]는 객체 접근입니다. (0) | 2024.10.23 |
| [JavaScript] 맵(Map) 객체의 set(), get() (0) | 2024.10.23 |
