본문 바로가기
Front

[Javascript] map 메서드 / key값 / value값 / map.get()

by bkuk 2022. 9. 20.

map 메서드 선언방식

map 생성 방식 1

let emptyMap = new Map();
    console.log( emptyMap);

 

 

 

map 생성 방식 2

let map2 = new Map( [

    [ "key1", "value" ],
    [ "key2", "value2" ],
    [ "key3", "value3" ]
   
   ]);

        console.log( map2 );
        console.log( map2.size );

 

key를 이용해 value를 저장한다.

 


데이터 불러오기

 

배열에서 했던 방식대로 저장된 데이터를 불러오자.

let map2 = new Map( [

    [ "key1", "value" ],
    [ "key2", "value2" ],
    [ "key3", "value3" ]
]);

        console.log( map2[0])
        console.log( map2[1])
        console.log( map2[2])

 

"undefined", 위와 같은 형식으로는 데이터를 불러올 수 없다고 출력됨.

 

 그렇다면 for of문을 이용해서 출력해보자.

 

let map2 = new Map( [

    [ "key1", "value" ],
    [ "key2", "value2" ],
    [ "key3", "value3" ]
]);

    for( let data of map2 ){
        console.log( data[0], data[1] );
        }

 

for of문을 이용하면 배열(?)과 같이 index[0] ~ index[1]을 순회해서 출력

(일단. 정리 해놓고, 공부하도록 하자!)

 

또한, for Each문을 이용해서 출력해보자.

let map2 = new Map( [

    [ "key1", "value" ],
    [ "key2", "value2" ],
    [ "key3", "value3" ]
]);

    map2.forEach( function(element, index, array) {
        console.log(element, index, array);
    })

 

 

 (값, 키, 오브젝트)로 출력된 것을 확인

 

추가로, 한가지 방법을 더 소개하고자 한다.

let map2 = new Map( [

    [ "key1", "value" ],
    [ "key2", "value2" ],
    [ "key3", "value3" ]
]);

    for( let [ key, value ] of map2 ) {
      console.log(key , value);
    }

 

 

 


map 객체 생성 후 key 와 value를 추가하는 방법

 

1. 객체 생성

let map = new Map();

 

2. map.set을 통한 key와 value 추가하고 확인하기

// 데이터 추가
map.set( "one", 100 );
map.set( "two", 200 );
map.set( "three", 300 );

// 데이터 추가 작업 확인
console.log(map);

 

순서대로 key 값과 value값이 삽입된 것을 확인

 

만들어진 map 객체를 for of문으로 순회해서 확인해보자

let map = new Map();

    map.set( "one", 100 );
    map.set( "two", 200 );
    map.set( "three", 300 );

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

 

 

 

map.get() 메서드를 을 이용해서 키값과 같이 저장된 value 값을 출력해보자.

 

let map = new Map();

    map.set( "one", 100 );
    map.set( "two", 200 );
    map.set( "three", 300 );

        console.log( map.get( "one" ) );
        console.log( map.get( "two" ) );

 

 

 

혹시, 반대로 value값을 통해 key값을 알수 있을까?

console.log( map.get( 100 ) );
console.log( map.get( 200 ) );

 

안된다.

댓글