[JavaScript] 자바스크립트 8강 셀프 체크 - 속도 순으로 정렬하기

 

문제 요구 사항

🟦 가장 빠른 다섯 번의 시도를 정렬

🟦 힌트 sort 메서드 사용

 

      $screen.addEventListener("click", (event) => {
        ...
        } else if (event.target.classList.contains("now")) {
          ...
          const rank = records
            .slice()
            .sort((a, b) => a - b)
            .splice(0, 5);
          for (let i = 0; i < rank.length; i++) {
            $result.append(document.createElement("br"),`${i + 1}위 : ${rank[i]}ms`);
          }
          startTime = null;
          endTime = null;
          ...
        }
      });

records의 결과를 slice, sort로 오름차순 정렬한 뒤 splice 함수로 상위 5개만 자르는 식으로 코드를 구현하였다.

 

실행 화면

정답

      $screen.addEventListener("click", (event) => {
        ...
        } else if (event.target.classList.contains("ready")) {
         ...
        } else if (event.target.classList.contains("now")) {
         ...
          const topFive = records.sort((p, c) => p - c).slice(0, 5);
          topFive.forEach((top, index) => {
            $result.append(
              document.createElement("br"),
              `${index + 1}위: ${top}ms`
            );
          });

• records를 오름차순 정렬하고 slice(0, 5)로 상위 5개만 가져온다.
• forEach문을 사용하여 반복문을 돌면서 화면에 줄바꿈 + 순위 결과를 출력한다.

영상 출처

https://tinyurl.com/4ytkkskb