[축구모임 홈페이지개발] 01/02 개발일지 Nodejs / 딕셔너리,new Map();

 

어제 수정 계획한 대로 

 

          <%for (i=1; i<13; i++) {%>

            <div class="MvpBoard-area">

              <div class="MvpBoard-area-rank"><%=i%></div>

              <div class="MvpBoard-area-name">ㅇㅇㅇ</div>

              <div class="MvpBoard-area-rank">265</div>

            </div>

          <%}%>

 

다음과 같이 반복문을 사용해줬고, 점수와 이름칸에는 서버로 부터 변수를 가져올 예정이다.

 

---

 

홈화면에 MVP Board 탭을 보면 순위에 맞게 이름 위치와 점수 위치가 바뀌어 출력되어야한다.

이를 어떻게 기능구현을 해볼지 고민을 하고 알아보던 중에 몇 가지 생각이 들었는데

그 중 내가 접근해볼 방법은

 

우선 관리탭에서 

 

이름

이름

이름

이름

 

이렇게 이름과 옆에 input 태그를 넣어 점수입력을 시킨다.

그런다음 위 데이터를 { 이름:점수, 이름:점수 ...} 꼴로 딕셔너리로 저장한다.

 

알아보니 javascript 딕셔너리는 key 와 value 값에서 value 의 크기 순서대로 재배치를 하는 기능이 없다고 한다.

 

   let myMap() = new Map();

 

      function updateMap() {

      let keyInput = document.getElementById('keyInput').value;

      let valueInput = document.getElementById('valueInput').value;

      myMap.set(keyInput, valueInput); console.log(`키 '${keyInput}'의 값이 변경되었습니다.`);

    }

 

다음과 같이 입력받은 key 와 value 값을 저장할 수 있다.

 

그리고 

    let sortedMap = new Map([...myMap.entries()].sort((a, b) => b[1] - a[1]));

 

위 코드를 통해서 순서대로 재배치할 수 있다.

위 속성을 기반으로 기능을 구현해보려한다.