웹접근성 기준(WCAG, KWCAG)은 “PC용/모바일용” 이렇게 나뉘지 않고 서비스 전체를 대상으로 합니다.

하나의 마스터 체크리스트/QA 시트를 만듭니다.

항목은 공통으로 두고,각 항목마다 PC / 모바일 결과 컬럼을 나눠서 체크하는 방식입니다.

예를 들면 엑셀에 이런 식:

즉, 체크 구조는 한 번 설계하고, PC/모바일은 그 안에서 각각 결과를 적는 느낌이 가장 깔끔합니다.

2. 실제 테스트는 PC/모바일 따로 도는 게 맞음

PC 쪽에서 특히 볼 것

• 키보드 탭 이동(포커스 트랩, 포커스 회귀)
• 스크린리더 (NVDA, JAWS, 또는 크롬Vox 등)
• 마우스와 키보드 겸용일 때 포커스가 튀는지
• 마우스 hover에만 의존하는 인터랙션 있는지(모바일 대비)

모바일 쪽에서 특히 볼 것

• 터치로만 조작 가능한지 (작은 터치 타겟, 간격 등)
• 스와이프 동작과 포커스 순서가 충돌 안 하는지
• 모바일 스크린리더 (TalkBack, VoiceOver)로
• 버튼/탭명 제대로 읽히는지
• 스와이프로 이동할 때 논리 순서 맞는지
• 모바일에서 떠 있는 고정 요소(고정 탭, 플로팅 버튼 등)가 스크린리더/포커스 방해 안 하는지

작업 순서 추천

1. PC 기준으로 구조/ARIA/포커스 로직 다잡기

   • 시맨틱 마크업, role/aria, 포커스 회귀, 키보드 동작 등.

2. 모바일 브레이크포인트 + 터치/스크린리더 테스트

   • 이미 짜둔 팝업/포커스 로직이 터치 환경에서 깨지는 부분만 보정.

3. 최종 QA 시트

   • 각 항목에 대해 PC: O/X, 모바일: O/X 식으로 결과 기록.

• 장애인이나 고령자 등 다양한 사용자가 웹사이트의 정보에 비장애인과 동등하게 접근하고 이해할 수 있도록 보장하는 것을 말합니다.
• 단순히 장애인을 위한 것이 아니라, 지역, 나이, 기술 수준 등 다양한 제약을 고려하여 가능한 많은 사용자가 불편 없이 웹 서비스를 이용하도록 하는 기준입니다.

현 프로젝트의 웹 접근성 이슈 정리(포커스 회귀 문제)

운영 프로젝트 특성상 과거 구축 단계에서 사용하던 공통 팝업 스크립트가 계속 재사용되고 있는데, 이 과정에서 웹 접근성(특히 포커스 회귀) 관련 문제가 반복적으로 발생하고 있습니다.

현재 공통 팝업 JS에서 포커스 회귀를 위한 인자를 전달받도록 되어 있으나,

- 인자 검증이 제대로 이루어지지 않거나,

- 전달받은 인자가 정상적으로 실행되지 않는 경우가 잦습니다.

또한 팝업 가이드에 스크립트 활용 방식에 대한 명확한 기준이 없다 보니, 작업자마다

- 인자를 사용하는 경우와 사용하지 않는 경우가 혼재되어 있고,

- 인자를 주었음에도 회귀가 정상적으로 이루어지지 않거나,

- 반대로 인자를 주지 않았는데도 우연히 회귀가 정상 동작하는 등

로직이 일관적으로 적용되지 않는 상황입니다.

결과적으로, 공통 팝업 스크립트가 페이지별로 예측 불가능하게 동작하며, 접근성 검수 단계에서 포커스가 팝업 열림/닫힘 시 올바르게 이동하지 않는 문제가 지속적으로 발생하고 있습니다.

공통팝업 가이드 작업

HTML

<!-- 여러 개의 열기 버튼이 있어도 공통 스크립트로 처리 -->
<button
    type="button"
    class="btn-open-popup" <!--팝업 버튼 공통 클래스-->
    data-popup-target="#popupFilter" <!--각각 팝업에 대한 데이터 속성으로 팝업 타깃-->
>
  필터 팝업 열기
</button>

<button
    type="button"
    class="btn-open-popup"
    data-popup-target="#popupNotice"
>
  안내 팝업 열기
</button>

<!-- ===== 팝업 1: 필터 팝업 ===== -->
<div
    id="popupFilter"
    class="pop-dx pop_wrap point_filter_pop small_tf"
    role="dialog"
    aria-modal="true"
    aria-labelledby="popupFilterTitle"
    aria-describedby="popupFilterDesc"
>
  <div class="pop_overlay" data-popup-close="overlay"></div>

  <article class="popup popup_type01">
    <h2 id="popupFilterTitle">포인트 필터 설정</h2>
    <div id="popupFilterDesc" class="popup_content">
      기간, 사용처, 혜택 유형 등을 선택해 필터링할 수 있습니다.
    </div>

    <div class="pop_btn btn_wrap btn-wrap-dx type2">
      <button type="button">초기화</button>
      <button type="button" class="ui-pop-close" data-popup-close="button">적용</button>
    </div>

    <button type="button" class="btn_close ui-pop-close" data-popup-close="button">
      <span>팝업 닫기</span>
    </button>
  </article>
</div>

<!-- ===== 팝업 2: 안내 팝업 ===== -->
<div
    id="popupNotice"
    class="pop-dx pop_wrap"
    role="dialog"
    aria-modal="true"
    aria-labelledby="popupNoticeTitle"
    aria-describedby="popupNoticeDesc"
>
  <div class="pop_overlay" data-popup-close="overlay"></div>

  <article class="popup popup_type01">
    <h2 id="popupNoticeTitle">안내사항</h2>
    <div id="popupNoticeDesc" class="popup_content">
      시스템 점검으로 오늘 밤 1시부터 3시까지 일부 서비스 이용이 제한됩니다.
    </div>
    <div class="btn-wrap-dx">
      <button type="button" class="ui-pop-close" data-popup-close="button">
        확인
      </button>
    </div>
    <button type="button" class="btn_close ui-pop-close" data-popup-close="button">
      <span>팝업 닫기</span>
    </button>
  </article>
</div>

CSS

body {
    margin: 0;
    padding: 40px;
    line-height: 1.5;
}

h1 {
    margin-top: 0;
    margin-bottom: 24px;
}

button {
    font-family: inherit;
}

/* ==== 팝업 열기 버튼 ==== */
.btn-open-popup {
    padding: 10px 16px;
    border-radius: 4px;
    border: 1px solid #ddd;
    background: #fff;
    cursor: pointer;
    margin-right: 8px;
}

/* ==== 공통 팝업 레이아웃 ==== */
.pop_wrap {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}
.pop_wrap.is-open {
    display: flex;
}

.pop_overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.popup {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 8px;
    padding: 24px 24px 18px;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

.popup h2 {
    margin: 0 0 8px;
    font-size: 18px;
}

.popup .popup_content {
    font-size: 14px;
    margin-bottom: 16px;
}

.btn-wrap-dx {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
}

.btn-wrap-dx button {
    padding: 8px 14px;
    border-radius: 4px;
    border: 1px solid #ddd;
    background: #f8f8f8;
    cursor: pointer;
    font-size: 14px;
}

/* 우측 상단 닫기 버튼 */
.btn_close {
    position: absolute;
    top: 8px;
    right: 8px;
    border: none;
    background: none;
    cursor: pointer;
    padding: 6px;
}
.btn_close span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.btn_close::before {
    content: "✕";
    font-size: 16px;
    line-height: 1;
}

Javascript

(function () {
  // ===== 공통: 포커스 가능한 요소 셀렉터 =====
  const FOCUSABLE_SELECTOR = [
    'a[href]',
    'area[href]',
    'button:not([disabled])',
    'input:not([disabled]):not([type="hidden"])',
    'select:not([disabled])',
    'textarea:not([disabled])',
    '[tabindex]:not([tabindex="-1"])'
  ].join(',');

  // 팝업별로 "어디서 열렸는지" 기억하는 Map ,, <-- 포커스 회귀인자를 따로 받지 않고 처리
  const focusPopUpMemory = new Map(); // popupElement -> triggerButton

  const openPopUpButtons = document.querySelectorAll('.btn-open-popup');

  openPopUpButtons.forEach((btn) => {
    btn.addEventListener('click', () => {
      const target = btn.getAttribute('data-popup-target');
      if (!target) return;
      const popup = document.querySelector(target);
      if (!popup) return;

      openPopup(popup, btn);
    });
  });

  function openPopup(popup, triggerButton) {
    // 1) 팝업을 어디서 열었는지 기억 (포커스 회귀용 ★핵심)
    focusPopUpMemory.set(popup, triggerButton);

    // 2) 팝업 열기
    popup.classList.add('is-open');

    // 3) 팝업 내부의 첫 번째 포커스 가능한 요소로 포커스 이동
    const focusableEls = popup.querySelectorAll(FOCUSABLE_SELECTOR);
    if (focusableEls.length > 0) {
      focusableEls[0].focus();
    } else {
      // 차선책: popup 자체에 tabindex를 주고 포커스
      popup.setAttribute('tabindex', '-1');
      popup.focus();
    }

    // 4) ESC, Tab 포커스 트랩, etc
    popup.addEventListener('keydown', handleKeyDown);
    // 5) 오버레이 / 닫기 버튼 공통 처리
    const overlay = popup.querySelector('[data-popup-close="overlay"]');
    if (overlay) {
      overlay.addEventListener('click', handleCloseEvent);
    }
    const closeButtons = popup.querySelectorAll('[data-popup-close="button"]');
    closeButtons.forEach((btn) => {
      btn.addEventListener('click', handleCloseEvent);
    });
  }

  function closePopup(popup) {
    popup.classList.remove('is-open');
    popup.removeEventListener('keydown', handleKeyDown);

    const overlay = popup.querySelector('[data-popup-close="overlay"]');
    if (overlay) {
      overlay.removeEventListener('click', handleCloseEvent);
    }
    const closeButtons = popup.querySelectorAll('[data-popup-close="button"]');
    closeButtons.forEach((btn) => {
      btn.removeEventListener('click', handleCloseEvent);
    });

    // ★★★ 포커스 회귀: 이 팝업을 열었던 버튼으로 포커스 이동 ★★★
    const triggerButton = focusPopUpMemory.get(popup);
    if (triggerButton && typeof triggerButton.focus === 'function') {
      triggerButton.focus();
    }

    // 기록 제거
    focusPopUpMemory.delete(popup);
  }

  function handleCloseEvent(event) {
    const popup = event.currentTarget.closest('[role="dialog"]');
    if (!popup) return;
    closePopup(popup);
  }

  function handleKeyDown(event) {
    const popup = event.currentTarget;
    const focusableEls = popup.querySelectorAll(FOCUSABLE_SELECTOR);
    const first = focusableEls[0];
    const last = focusableEls[focusableEls.length - 1];

    // ESC로 닫기
    if (event.key === 'Escape' || event.key === 'Esc') {
      event.preventDefault();
      closePopup(popup);
      return;
    }

    // Tab 포커스 트랩 (팝업 안에서만 돌도록)
    if (event.key === 'Tab') {
      if (focusableEls.length === 0) {
        event.preventDefault();
        return;
      }

      if (event.shiftKey) {
        if (document.activeElement === first) {
          event.preventDefault();
          last.focus();
        }
      } else {
        if (document.activeElement === last) {
          event.preventDefault();
          first.focus();
        }
      }
    }
  }
})();

문자열 my_string이 매개변수로 주어집니다. my_string을 거꾸로 뒤집은 문자열을 return하도록 solution 함수를 완성해주세요.

[제한]

• 1 ≤ my_string의 길이 ≤ 1,000

[입출력 예]

[입출력 예 설명]

입출력 예 #1

my_string이 "jaron"이므로 거꾸로 뒤집은 "noraj"를 return합니다. 입출력 예 #2

my_string이 "bread"이므로 거꾸로 뒤집은 "daerb"를 return합니다.

[answer]

function solution(my_string) {
    var answer = '';
    answer = my_string.split("").reverse().join("");
    return answer;
}

[리팩토링]

//스프레드 문법!!
function solution(my_string) {
    var answer = [...my_string].reverse().join("");
    return answer;
}

정수가 들어 있는 배열 num_list가 매개변수로 주어집니다. num_list의 원소의 순서를 거꾸로 뒤집은 배열을 return하도록 solution 함수를 완성해주세요.

[제한]

• 1 ≤ num_list의 길이 ≤ 1,000
• 0 ≤ num_list의 원소 ≤ 1,000

[입출력 예]

[입출력 예 설명]

입출력 예 #1

num_list가 [1, 2, 3, 4, 5]이므로 순서를 거꾸로 뒤집은 배열 [5, 4, 3, 2, 1]을 return합니다. 입출력 예 #2

num_list가 [1, 1, 1, 1, 1, 2]이므로 순서를 거꾸로 뒤집은 배열 [2, 1, 1, 1, 1, 1]을 return합니다. 입출력 예 #3

num_list가 [1, 0, 1, 1, 1, 3, 5]이므로 순서를 거꾸로 뒤집은 배열 [5, 3, 1, 1, 1, 0, 1]을 return합니다.

[answer]

function solution(num_list) {
    var answer = [];
    answer = num_list.reverse();
    return answer;
}

카카오에 입사한 신입 개발자 네오는 "카카오계정개발팀"에 배치되어, 카카오 서비스에 가입하는 유저들의 아이디를 생성하는 업무를 담당하게 되었습니다. "네오"에게 주어진 첫 업무는 새로 가입하는 유저들이 카카오 아이디 규칙에 맞지 않는 아이디를 입력했을 때, 입력된 아이디와 유사하면서 규칙에 맞는 아이디를 추천해주는 프로그램을 개발하는 것입니다. 다음은 카카오 아이디의 규칙입니다.

아이디의 길이는 3자 이상 15자 이하여야 합니다. 아이디는 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.) 문자만 사용할 수 있습니다. 단, 마침표(.)는 처음과 끝에 사용할 수 없으며 또한 연속으로 사용할 수 없습니다. "네오"는 다음과 같이 7단계의 순차적인 처리 과정을 통해 신규 유저가 입력한 아이디가 카카오 아이디 규칙에 맞는 지 검사하고 규칙에 맞지 않은 경우 규칙에 맞는 새로운 아이디를 추천해 주려고 합니다. 신규 유저가 입력한 아이디가 new_id 라고 한다면,

1단계 new_id의 모든 대문자를 대응되는 소문자로 치환합니다. 2단계 new_id에서 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.)를 제외한 모든 문자를 제거합니다. 3단계 new_id에서 마침표(.)가 2번 이상 연속된 부분을 하나의 마침표(.)로 치환합니다. 4단계 new_id에서 마침표(.)가 처음이나 끝에 위치한다면 제거합니다. 5단계 new_id가 빈 문자열이라면, new_id에 "a"를 대입합니다. 6단계 new_id의 길이가 16자 이상이면, new_id의 첫 15개의 문자를 제외한 나머지 문자들을 모두 제거합니다. 만약 제거 후 마침표(.)가 new_id의 끝에 위치한다면 끝에 위치한 마침표(.) 문자를 제거합니다. 7단계 new_id의 길이가 2자 이하라면, new_id의 마지막 문자를 new_id의 길이가 3이 될 때까지 반복해서 끝에 붙입니다.

예를 들어, new_id 값이 "...!@BaT#*..y.abcdefghijklm" 라면, 위 7단계를 거치고 나면 new_id는 아래와 같이 변경됩니다.

1단계 대문자 'B'와 'T'가 소문자 'b'와 't'로 바뀌었습니다.

"...!@BaT#..y.abcdefghijklm" → "...!@bat#..y.abcdefghijklm"

2단계 '!', '@', '#', '*' 문자가 제거되었습니다.

"...!@bat#*..y.abcdefghijklm" → "...bat..y.abcdefghijklm"

3단계 '...'와 '..' 가 '.'로 바뀌었습니다.

"...bat..y.abcdefghijklm" → ".bat.y.abcdefghijklm"

4단계 아이디의 처음에 위치한 '.'가 제거되었습니다.

".bat.y.abcdefghijklm" → "bat.y.abcdefghijklm"

5단계 아이디가 빈 문자열이 아니므로 변화가 없습니다.

"bat.y.abcdefghijklm" → "bat.y.abcdefghijklm"

6단계 아이디의 길이가 16자 이상이므로, 처음 15자를 제외한 나머지 문자들이 제거되었습니다.

"bat.y.abcdefghijklm" → "bat.y.abcdefghi"

7단계 아이디의 길이가 2자 이하가 아니므로 변화가 없습니다.

"bat.y.abcdefghi" → "bat.y.abcdefghi"

따라서 신규 유저가 입력한 new_id가 "...!@BaT#*..y.abcdefghijklm"일 때, 네오의 프로그램이 추천하는 새로운 아이디는 "bat.y.abcdefghi" 입니다.

[문제]

신규 유저가 입력한 아이디를 나타내는 new_id가 매개변수로 주어질 때, "네오"가 설계한 7단계의 처리 과정을 거친 후의 추천 아이디를 return 하도록 solution 함수를 완성해 주세요.

[제한]

new_id는 길이 1 이상 1,000 이하인 문자열입니다. new_id는 알파벳 대문자, 알파벳 소문자, 숫자, 특수문자로 구성되어 있습니다. new_id에 나타날 수 있는 특수문자는 -_.~!@#$%^&*()=+[{]}:?,<>/ 로 한정됩니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1 문제의 예시와 같습니다.

입출력 예 #2 7단계를 거치는 동안 new_id가 변화하는 과정은 아래와 같습니다.

1단계 변화 없습니다. 2단계 "z-+.^." → "z-.." 3단계 "z-.." → "z-." 4단계 "z-." → "z-" 5단계 변화 없습니다. 6단계 변화 없습니다. 7단계 "z-" → "z--"

입출력 예 #3 7단계를 거치는 동안 new_id가 변화하는 과정은 아래와 같습니다.

1단계 변화 없습니다. 2단계 "=.=" → "." 3단계 변화 없습니다. 4단계 "." → "" (new_id가 빈 문자열이 되었습니다.) 5단계 "" → "a" 6단계 변화 없습니다. 7단계 "a" → "aaa"

입출력 예 #4 1단계에서 7단계까지 거치는 동안 new_id("123_.def")는 변하지 않습니다. 즉, new_id가 처음부터 카카오의 아이디 규칙에 맞습니다.

입출력 예 #5 1단계 변화 없습니다. 2단계 변화 없습니다. 3단계 변화 없습니다. 4단계 변화 없습니다. 5단계 변화 없습니다. 6단계 "abcdefghijklmn.p" → "abcdefghijklmn." → "abcdefghijklmn" 7단계 변화 없습니다.

[answer]

function solution(new_id) {
    let answer = '';
    // 1단계
    const firstStep = new_id.toLowerCase();
    let newIdArr = firstStep.split("");
    // 2단계
    newIdArr = newIdArr.filter(ch => /[a-z0-9._-]/.test(ch));
    // 3단계, 4단계
    let newIdStr = newIdArr.join("").replace(/\.{2,}/g, ".").replace(/^\.|\.$/g, "");
    if (newIdStr === "") newIdStr = "a";

    // 6단계
    if(newIdStr.length >= 16){
      newIdStr = newIdStr.slice(0, 15).replace(/\.$/g, ""); 
    }
    // 7단계
    if(newIdStr.length <= 2){
      while(newIdStr.length < 3){
        newIdStr += newIdStr[newIdStr.length - 1]; 
      }   
    }

    answer = newIdStr; 
    return answer;
}

자 이제 다시 시작~!!

[codesandbox] https://codepen.io/soyean7979/pen/dPGQweq?editors=0011

정수 n이 매개변수로 주어질 때 n의 각 자리 숫자의 합을 return하도록 solution 함수를 완성해주세요

[제한]

• 0 ≤ n ≤ 1,000,000

[입출력 예]

[입출력 예 설명]

입출력 예 #1 1 + 2 + 3 + 4 = 10을 return합니다.

입출력 예 #2 9 + 3 + 0 + 2 + 1 + 1 = 16을 return합니다.

[answer]

function solution(n) {
  let answer = 0;
  const arr = (n + "").split("");

  for (let i = 0; i < arr.length; i++) {
    answer += Number(arr[i]);
  }
  return answer;
}

자 이제 다시 시작~!!

[codesandbox] https://codesandbox.io/s/kodingteseuteu-46-7vfnsh

1부터 입력받은 숫자 n 사이에 있는 소수의 개수를 반환하는 함수, solution을 만들어 보세요.

소수는 1과 자기 자신으로만 나누어지는 수를 의미합니다. (1은 소수가 아닙니다.)

[제한]

• n은 2이상 1000000이하의 자연수입니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1 1부터 10 사이의 소수는 [2,3,5,7] 4개가 존재하므로 4를 반환

입출력 예 #2 1부터 5 사이의 소수는 [2,3,5] 3개가 존재하므로 3를 반환

[answer]

function isPrime(num) {
  for (let i = 2; i <= Math.sqrt(num); i++) {
    if (num % i === 0) return false;
  }
  return true;
}

function solution(n) {
  let answer = 0;
  for (let i = 2; i <= n; i++) {
    if (isPrime(i)) answer++;
  }
  return answer;
}

효율성 체크에서 땡!...

소수판별함수인 isPrime() 함수를 이전에 풀었던 메소드를 가져와서 풀었는데, 효율성에서 땡땡땡!!! 아직 그 이유를 파악하지 못했다...ㅠㅠ

 function isPrime(sum) {
    if (sum === 2) return true;
    for (let i = 2; i < sum; i++) {
      if (sum % i === 0) return false;
    }
    return true;
  }

코드를 돌리는데에 있어서 그렇게 차이가 없어 보이는데,, 왜... 그런걸까요?? 아시는분??ㅠㅠ

[codesandbox] https://codesandbox.io/s/coding-test-daily-45-hjngc4

어떤 문장의 각 알파벳을 일정한 거리만큼 밀어서 다른 알파벳으로 바꾸는 암호화 방식을 시저 암호라고 합니다. 예를 들어 "AB"는 1만큼 밀면 "BC"가 되고, 3만큼 밀면 "DE"가 됩니다. "z"는 1만큼 밀면 "a"가 됩니다. 문자열 s와 거리 n을 입력받아 s를 n만큼 민 암호문을 만드는 함수, solution을 완성해 보세요.

[제한]

• 공백은 아무리 밀어도 공백입니다.
• s는 알파벳 소문자, 대문자, 공백으로만 이루어져 있습니다.
• s의 길이는 8000이하입니다.
• n은 1 이상, 25이하인 자연수입니다.

[입출력 예]

[answer]

function solution(s, n) {
  let answer = [];
  let arr = s.split("");
  arr.map((v) => {
    let stringASCII = v.charCodeAt();
    if (stringASCII === 32) {
      stringASCII += " ";
    } else if (stringASCII >= 65 && stringASCII <= 90) {
      stringASCII += n;
      if (stringASCII > 90) {
        stringASCII -= 26;
      }
    } else if (stringASCII >= 97 && stringASCII <= 122) {
      stringASCII += n;
      if (stringASCII > 122) {
        stringASCII -= 26;
      }
    }
    answer += String.fromCharCode(stringASCII);
  });
  return answer;
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-44-ifzbzh

정수 n을 입력받아 n의 약수를 모두 더한 값을 리턴하는 함수, solution을 완성해주세요.

[제한]

• n은 0 이상 3000이하인 정수입니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1 12의 약수는 1, 2, 3, 4, 6, 12입니다. 이를 모두 더하면 28입니다.

입출력 예 #2 5의 약수는 1, 5입니다. 이를 모두 더하면 6입니다.

[answer]

function solution(n) {
  let answer = 0;
  for (let i = 1; i <= n; i++) {
    if (n % i === 0) {
      answer += i;
    }
  }
  return answer;
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-43-yz6miw

임의의 양의 정수 n에 대해, n이 어떤 양의 정수 x의 제곱인지 아닌지 판단하려 합니다. n이 양의 정수 x의 제곱이라면 x+1의 제곱을 리턴하고, n이 양의 정수 x의 제곱이 아니라면 -1을 리턴하는 함수를 완성하세요.

[제한]

• n은 1이상, 50000000000000 이하인 양의 정수입니다.

[입출력 예]

[입출력 예 설명]

입출력 예#1 121은 양의 정수 11의 제곱이므로, (11+1)를 제곱한 144를 리턴합니다.

입출력 예#2 3은 양의 정수의 제곱이 아니므로, -1을 리턴합니다.

[answer]

function solution(n) {
  let answer = 0;
  let sqrt = Math.sqrt(n);
  if (sqrt % 1 !== 0) {
    answer = -1;
  } else {
    answer = Math.pow(sqrt + 1, 2);
  }
  return answer;
}

정수 제곱근

Math.sqrt()

숫자의 제곱근을 반환한다.

Math.sqrt(9); // 3
Math.sqrt(2); // 1.414213562373095

Math.sqrt(1);  // 1
Math.sqrt(0);  // 0
Math.sqrt(-1); // NaN

Math.pow(base, exponent)

base(밑값)에 exponent(밑을 제곱하기 위해 사용하는 지수)를 제곱한 값을 반환한다.

// 간단한 예
Math.pow(7, 2);    // 49 :: 7의 2제곱근
Math.pow(7, 3);    // 343 :: 7의 3제곱근
Math.pow(2, 10);   // 1024
// 분수 지수
Math.pow(4, 0.5);  // 2 (4의 제곱근)
Math.pow(8, 1/3);  // 2 (8의 세제곱근)
Math.pow(2, 0.5);  // 1.4142135623730951 (2의 제곱근)
Math.pow(2, 1/3);  // 1.2599210498948732 (2의 세제곱근)
// 양의 지수
Math.pow(7, -2);   // 0.02040816326530612 (1/49)
Math.pow(8, -1/3); // 0.5
// 양의 밑
Math.pow(-7, 2);   // 49 (제곱의 결과값은 양수입니다.)
Math.pow(-7, 3);   // -343 (세제곱은 음수가 될 수 있습니다.)
Math.pow(-7, 0.5); // NaN (음수는 실제 제곱근을 가지지 않습니다.)
// "짝수"와 "홀수" 근이 서로 가깝게 놓여 있고
// 부동소수점 정밀도의 한계로 인해,
// 밑이 음수이며 지수가 분수라면 언제나 NaN을 반환합니다.
Math.pow(-7, 1/3); // NaN

[codesandbox] https://codesandbox.io/s/coding-test-daily-42-og79i2

문자열 s는 한 개 이상의 단어로 구성되어 있습니다. 각 단어는 하나 이상의 공백문자로 구분되어 있습니다. 각 단어의 짝수번째 알파벳은 대문자로, 홀수번째 알파벳은 소문자로 바꾼 문자열을 리턴하는 함수, solution을 완성하세요.

[제한]

• 문자열 전체의 짝/홀수 인덱스가 아니라, 단어(공백을 기준)별로 짝/홀수 인덱스를 판단해야합니다.
• 첫 번째 글자는 0번째 인덱스로 보아 짝수번째 알파벳으로 처리해야 합니다.

[입출력 예]

[입출력 예 설명]

"try hello world"는 세 단어 "try", "hello", "world"로 구성되어 있습니다. 각 단어의 짝수번째 문자를 대문자로, 홀수번째 문자를 소문자로 바꾸면 "TrY", "HeLlO", "WoRlD"입니다. 따라서 "TrY HeLlO WoRlD" 를 리턴합니다.

[answer]

function solution(s) {
  let answer = [];
  const arr = s.split(" ");
  arr.forEach((val, idx) => {
    const chk = arr[idx].split("");
    let mapArr = chk.map((el, i) => {
      if (i % 2 === 0) {
        return el.toUpperCase();
      } else {
        return el.toLowerCase();
      }
    });
    answer.push(mapArr.join(""));
  });
  return answer.join(" ");
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-41-whf65q

두 수를 입력받아 두 수의 최대공약수와 최소공배수를 반환하는 함수, solution을 완성해 보세요. 배열의 맨 앞에 최대공약수, 그다음 최소공배수를 넣어 반환하면 됩니다. 예를 들어 두 수 3, 12의 최대공약수는 3, 최소공배수는 12이므로 solution(3, 12)는 [3, 12]를 반환해야 합니다.

[제한]

• 두 수는 1이상 1000000이하의 자연수입니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1 위의 설명과 같습니다.

입출력 예 #2 자연수 2와 5의 최대공약수는 1, 최소공배수는 10이므로 [1, 10]을 리턴해야 합니다.

[answer]

function solution(n, m) {
  return [gcd(n, m), lcm(n, m)];
}
//최대공약수 유클리드 호제법
let gcd = (n, m) => {
  if (m === 0) return n;
  return n > m ? gcd(m, n % m) : gcd(n, m % n);
};
//최소 공배수 = 주어진 인자들의 곱 후 최대공약수로 나누기
let lcm = (n, m) => {
  return (n * m) / gcd(n, m);
};

문제의 해석

최대공약수를 구하는 방법 - <유클리드 호제법>

• 유클리드 호제법의 원리

  1) 두 수 중에서 큰 수를 작은 수로 나눈다. 2-1) 나누고 난 나머지가 0 이면, 작은 수가 최대 공약수가 된다 2-2) 나머지가 0이 아니라면, 작은 수를 다시 나머지로 나눈다. 3) 나머지가 0이 될때까지 반복하면, 그 수가 최대공약수가 된다.

최소공배수를 구하는 방법

• 주어진 두 수의 곱하기를 한 후 최대공약수로 나누면 된다.

[codesandbox] https://codesandbox.io/s/coding-test-daily-40-2rml4r

길이가 같은 배열 A, B 두개가 있습니다. 각 배열은 자연수로 이루어져 있습니다. 배열 A, B에서 각각 한 개의 숫자를 뽑아 두 수를 곱합니다. 이러한 과정을 배열의 길이만큼 반복하며, 두 수를 곱한 값을 누적하여 더합니다. 이때 최종적으로 누적된 값이 최소가 되도록 만드는 것이 목표입니다. (단, 각 배열에서 k번째 숫자를 뽑았다면 다음에 k번째 숫자는 다시 뽑을 수 없습니다.)

예를 들어 A = [1, 4, 2] , B = [5, 4, 4] 라면

• A에서 첫번째 숫자인 1, B에서 첫번째 숫자인 5를 뽑아 곱하여 더합니다. (누적된 값 : 0 + 5(1x5) = 5)
• A에서 두번째 숫자인 4, B에서 세번째 숫자인 4를 뽑아 곱하여 더합니다. (누적된 값 : 5 + 16(4x4) = 21)
• A에서 세번째 숫자인 2, B에서 두번째 숫자인 4를 뽑아 곱하여 더합니다. (누적된 값 : 21 + 8(2x4) = 29) 즉, 이 경우가 최소가 되므로 29를 return 합니다.

배열 A, B가 주어질 때 최종적으로 누적된 최솟값을 return 하는 solution 함수를 완성해 주세요.

[제한]

• 배열 A, B의 크기 : 1,000 이하의 자연수
• 배열 A, B의 원소의 크기 : 1,000 이하의 자연수

[입출력 예]

[answer]

function solution(A, B) {
  let answer = 0;
  A = A.sort((a, b) => a - b); // 오름차순 정렬
  B = B.sort((a, b) => b - a); // 내림차순 정렬
  for (let i = 0; i < A.length; i++) {
    answer += A[i] * B[i];
  }
  return answer;
}

문제의 해석

"최종적으로 누적된 값이 최소가 되도록 만드는 것이 목표" 이므로, A배열에서의 최솟값 * B배열에서의 최댓값을 구하면 최소가 된다...(알아두자...) A는 오름차순 정렬을 하고 B는 내림차순 정렬을 해야한다.

[codesandbox] https://codesandbox.io/s/coding-test-daily-39-ovrlpv

JadenCase란 모든 단어의 첫 문자가 대문자이고, 그 외의 알파벳은 소문자인 문자열입니다. 단, 첫 문자가 알파벳이 아닐 때에는 이어지는 알파벳은 소문자로 쓰면 됩니다. (첫 번째 입출력 예 참고) 문자열 s가 주어졌을 때, s를 JadenCase로 바꾼 문자열을 리턴하는 함수, solution을 완성해주세요.

[제한]

• s는 길이 1 이상 200 이하인 문자열입니다.
• s는 알파벳과 숫자, 공백문자(" ")로 이루어져 있습니다.
  • 숫자는 단어의 첫 문자로만 나옵니다.
  • 숫자로만 이루어진 단어는 없습니다.
  • 공백문자가 연속해서 나올 수 있습니다.

[입출력 예]

첫번째 답안 ---> 땡!

function solution(s) {
  let arr = s.split(" ");
  let answer = arr.map((e) => {
    let str = e.split("");
    str[0] = str[0].toUpperCase();
    return str.join("");
  });
  return answer.join(" ");
}

[answer]

function solution(s) {
  let arr = s.toLowerCase().split(" ");
  let answer = arr
    .map((e) => {
      let str = e.split("");
      if (str[0] != null) {
        str[0] = str[0].toUpperCase();
      }
      return str.join("");
    })
    .join(" ");
  return answer;
}

난 왜 틀렸을까?

그동안 왜 틀렸는지 고민만 해보다가 구글링을 해보았다. "문자열 s, 맨앞 맨뒤 공백인 경우도 있다...." 그래서 if문 예외처리를 꼭 해줘야 한다...

[출처 sso님]

[codesandbox] https://codesandbox.io/s/coding-test-daily-37-nh9965

문자열 s에는 공백으로 구분된 숫자들이 저장되어 있습니다. str에 나타나는 숫자 중 최소값과 최대값을 찾아 이를 "(최소값) (최대값)"형태의 문자열을 반환하는 함수, solution을 완성하세요. 예를들어 s가 "1 2 3 4"라면 "1 4"를 리턴하고, "-1 -2 -3 -4"라면 "-4 -1"을 리턴하면 됩니다.

[제한]

• s에는 둘 이상의 정수가 공백으로 구분되어 있습니다.

[입출력 예]

첫번째 답안 ---> 땡!

function solution(s) {
  const arr = s.split(" ");
  const maxNum = Math.max(...arr);
  const minNum = Math.min(...arr);
  const answer = minNum + " " + maxNum;
  return answer;
}

다른 사람 풀이, 리팩토링

function solution(s) {
  const arr = s.split(" ");
  return Math.min(...arr) + " " + Math.max(...arr);
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-38-8q8394

0부터 9까지의 숫자 중 일부가 들어있는 정수 배열 numbers가 매개변수로 주어집니다. numbers에서 찾을 수 없는 0부터 9까지의 숫자를 모두 찾아 더한 수를 return 하도록 solution 함수를 완성해주세요.

[제한]

• 1 ≤ numbers의 길이 ≤ 9
  • 0 ≤ numbers의 모든 원소 ≤ 9
  • numbers의 모든 원소는 서로 다릅니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1

• 5, 9가 numbers에 없으므로, 5 + 9 = 14를 return 해야 합니다.

입출력 예 #2

• 1, 2, 3이 numbers에 없으므로, 1 + 2 + 3 = 6을 return 해야 합니다.

[answers.js]

function solution(numbers) {
  let answer = -1;
  const basicNum = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
  let filterArr = basicNum.filter((e) => !numbers.includes(e));
  answer = filterArr.reduce((num1, num2) => {
    return num1 + num2;
  }, 0);
  return answer;
}

다른 사람 풀이

0-9 까지 전체 합에서 numbers 숫자 합을 빼면 된다니.........

function solution(numbers) {
    return 45 - numbers.reduce((cur, acc) => cur + acc, 0);
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-36-kl93dm

키를 사용해 식별할 수 있는 값을 담은 컬렉션은 객체라는 자료구조를 이용해 저장하는데, 객체만으로도 다양한 작업을 할 수 있다.

그런데 개발을 진행하다 보면 첫 번째 요소, 두 번째 요소, 세 번째 요소 등과 같이 순서가 있는 컬렉션이 필요할 때가 생기곤 한다. 사용자나 물건, HTML 요소 목록같이 일목요연하게 순서를 만들어 정렬하기 위해서 말이다.

순서가 있는 컬렉션을 다뤄야 할 때 객체를 사용하면 순서와 관련된 메서드가 없어 그다지 편리하지 않다. 객체는 태생이 순서를 고려하지 않고 만들어진 자료구조이기 때문에 객체를 이용하면 새로운 프로퍼티를 기존 프로퍼티 ‘사이에’ 끼워 넣는 것도 불가능하다.

이럴 땐 순서가 있는 컬렉션을 저장할 때 쓰는 자료구조인 배열을 사용할 수 있다.

Array 메소드를 알아보자

join()

배열의 모든 요소를 하나의 문자열로 반환

const fruits = ['apple', 'banana', 'orange'];
const answer = fruits.join(' and ');
//apple and banana and orange

split()

문자열을 배열로 반환

const fruits2 = '🍎, 🥝, 🍌, 🍒';
const answer2 = fruits2.split(',');

//['🍎', '🥝', '🍌', '🍒']

splice()

원본 배열에서 기존 요소를 삭제 또는 교체하여 원본 배열을 변경하고 제거된 배열 반환 start : 추출 시작점에 대한 인덱스 end : 추출을 종료할 기준의 인덱스, end 이전 까지 요소만 추출

slice()

처음부터 끝 점까지의 복사본을 새로운 배열 객체로 반환, 즉 원본 배열 수정 되지 않음 start : 추출 시작점에 대한 인덱스 end : 추출을 종료할 기준의 인덱스, end 이전 까지 요소만 추출

const array = [1, 2, 3, 4, 5];
const answer4 = array.splice(0, 2);

// array
// [3, 4, 5]

// answer4
// [1, 2]

const answer41 = array.slice(1, 3); 
// [2, 3]

객체로 이루어진 배열 예시로 진행해보자

students = [
    {​​​ 
        name: 'A', 
        age: 29, 
        enrolled: true, 
        score: 45
    }​​​​​​​​​​,
    {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 
        name: 'B', 
        age: 28, 
        enrolled: false, 
        score: 80
    }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​,
    {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 
        name: 'C', 
        age: 30, 
        enrolled: true, 
        score: 90
    }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​,
    {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 
        name: 'D', 
        age: 40, 
        enrolled: false, 
        score: 66
    }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​,
    {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 
        name: 'E', 
        age: 18, 
        enrolled: true, 
        score: 88
    }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​,
]

find()

메서드는 주어진 판별 함수를 만족하는 첫 번째 요소의 값을 반환

const answer5 = students.find((e) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
    return e.score >= 79;
}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​);

// {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ name: 'B', age: 28, enrolled: false, score: 80 }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

filter()

주어진 조건에 충족하는 요소를 모두 반환 (조건에 false면 버림)

const answer6 = students.filter((e) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
    return e.enrolled;
}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​);

// 
{​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ name: 'A', age: 29, enrolled: true, score: 45}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
{​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ name: 'C', age: 30, enrolled: true, score: 90}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
{​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ name: 'E', age: 18, enrolled: true, score: 88}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

map()

요소를 각각 순서대로 돌아서 조건에 충족하는 결과값을 모아 새로운 배열로 반환

const answer7 = students.map((e) => e.score * 3);

// [135, 240, 270, 198, 264]

forEach()

각 배열 요소를 한번씩 돌아~, 배열을 변형하지않고, 콜백함수로 변형할 수 있다. 반복문 for문을 사용했을 때보다 직관적이며 간결.

 for (let i = 0; i < students.length; i++) {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
  //console.log(students[i]);
 }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

students.forEach((e) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
  //console.log(e);
 }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​);

some()

배열의 요소 중 하나라도 true 면 true 반환

every()

배열의 요소 모두가 true여야만 true 반환, 아니면 false 반환

const answer8 = students.some((e) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
  return e.score < 50;
}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​);
// true

const answer9 = students.every((e) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
  return e.score < 50;
}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​);
// false

indexOf()

배열에서 지정된 요소를 찾을 수 있는 첫 번째 인덱스를 반환하고 , 존재하지 않으면 -1

const superheroes = ['아이언맨', '캡틴 아메리카', '토르', '닥터 스트레인지'];
const index = superheroes.indexOf('토르');

//2

findeIndex()

주어진 판별 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환, 존재하지 않으면 -1

const aaa = students.findIndex((e) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
  return e.age > 29;
}​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​);

//2

reduce()

배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환

reduce((누적값, 현잿값, 인덱스, 요소) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ return 결과 }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​, 초깃값);
초깃값을 적어주지 않으면 자동으로 초깃값이 0번째 인덱스의 값이 됨

 const average = students.reduce((accumulator, current, index) => {​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
  if(index === students.length - 1){​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ // 마지막 index 이면
    return (accumulator + current.score) / students.length
  }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
    // console.log('---------------');
    // console.log(accumulator);
    // console.log(current.score)
    return accumulator + current.score
 }​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​,0);

 // 73.8

sort()

배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환

 // 오름 차순
 const answer15 = students.map((student) => student.score).sort();
 //[45, 66, 80, 88, 90]

 //내림 차순
 const answer16 = students
 .map((student) => student.score)
 .sort((a, b) => {​​​​​​​​​​​​​​​​​​​​​​
    return b - a;
 }​​​​​​​​​​​​​​​​​​​​​​);

 //[90, 88, 80, 66, 45]

어떤 정수들이 있습니다. 이 정수들의 절댓값을 차례대로 담은 정수 배열 absolutes와 이 정수들의 부호를 차례대로 담은 불리언 배열 signs가 매개변수로 주어집니다. 실제 정수들의 합을 구하여 return 하도록 solution 함수를 완성해주세요.

[제한]

• absolutes의 길이는 1 이상 1,000 이하입니다.
  • absolutes의 모든 수는 각각 1 이상 1,000 이하입니다.
• signs의 길이는 absolutes의 길이와 같습니다.
  • signs[i] 가 참이면 absolutes[i] 의 실제 정수가 양수임을, 그렇지 않으면 음수임을 의미합니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1

• signs가 [true,false,true] 이므로, 실제 수들의 값은 각각 4, -7, 12입니다.
• 따라서 세 수의 합인 9를 return 해야 합니다.

입출력 예 #2

• signs가 [false,false,true] 이므로, 실제 수들의 값은 각각 -1, -2, 3입니다.
• 따라서 세 수의 합인 0을 return 해야 합니다.

[answers.js]

function solution(absolutes, signs) {
  let answer = 0;
  for (let i = 0; i < absolutes.length; i++) {
    if (signs[i]) {
      answer += absolutes[i];
    } else {
      answer -= absolutes[i];
    }
  }
  return answer;
}

reduce 사용시

function solution(absolutes, signs) {
  let answer = 0;
  answer = absolutes.reduce(
    (acc, val, i) => (signs[i] ? acc + val : acc + -val),
    0
  );
  return answer;
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-35-9uhyky

주어진 숫자 중 3개의 수를 더했을 때 소수가 되는 경우의 개수를 구하려고 합니다. 숫자들이 들어있는 배열 nums가 매개변수로 주어질 때, nums에 있는 숫자들 중 서로 다른 3개를 골라 더했을 때 소수가 되는 경우의 개수를 return 하도록 solution 함수를 완성해주세요.

[제한]

• nums에 들어있는 숫자의 개수는 3개 이상 50개 이하입니다.
• nums의 각 원소는 1 이상 1,000 이하의 자연수이며, 중복된 숫자가 들어있지 않습니다.

[입출력 예]

[입출력 예 설명]

입출력 예 #1 [1,2,4]를 이용해서 7을 만들 수 있습니다.

입출력 예 #2 [1,2,4]를 이용해서 7을 만들 수 있습니다. [1,4,6]을 이용해서 11을 만들 수 있습니다. [2,4,7]을 이용해서 13을 만들 수 있습니다. [4,6,7]을 이용해서 17을 만들 수 있습니다.

[answers.js]

function solution(nums) {
  let answer = 0;
  for (let i = 0; i < nums.length; i++) {
    for (let j = i + 1; j < nums.length; j++) {
      for (let f = j + 1; f < nums.length; f++) {
        let sum = nums[i] + nums[j] + nums[f];
        if (isPrime(sum)) {
          answer++;
        }
      }
    }
  }

  function isPrime(sum) {
    if (sum === 2) return true;
    for (let i = 2; i < sum; i++) {
      if (sum % i === 0) return false;
    }
    return true;
  }

  return answer;
}

소수란??

소수란, 1과 자신만으로 나누어 떨어지는 1보다 큰 양수를 뜻한다
ex) 2,5,11,71

소수 판별 함수

function isPrime(number) {
  if (number === 2) return true; // 2부터 소수 판별이 가능한 숫자이기에 2는 소수니깐 true
  for (let i = 2; i < number; i++) { // 2부터 주어진 인자까지 소수 판별 for문
    if (number % i === 0) return false; //나누어지면,false
  }
  return true; //for문을 다 돌고 빠져나올때까지 나누어지는 수가 없다면 true
}

[codesandbox] https://codesandbox.io/s/coding-test-daily-34-yq8htd?file=/src/index.js

수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다.

마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요.

[제한]

• 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다.
• completion의 길이는 participant의 길이보다 1 작습니다.
• 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다.
• 참가자 중에는 동명이인이 있을 수 있습니다.

[입출력 예]

[입출력 예 설명]

예제 #1 "leo"는 참여자 명단에는 있지만, 완주자 명단에는 없기 때문에 완주하지 못했습니다.

예제 #2 "vinko"는 참여자 명단에는 있지만, 완주자 명단에는 없기 때문에 완주하지 못했습니다.

예제 #3 "mislav"는 참여자 명단에는 두 명이 있지만, 완주자 명단에는 한 명밖에 없기 때문에 한명은 완주하지 못했습니다.

나의 첫 풀이 - 땡!

function solution(participant, completion) {
  const answer = participant.filter((v, i) => {
    if (!completion.includes(v) || participant.indexOf(v) !== i) return v;
  });
  console.log("정답", answer.toString());
  return answer.toString();
}

solution(["mislav", "stanko", "mislav", "ana"], ["stanko", "ana", "mislav"]);

[answers.js]

function solution(participant, completion) {
  participant.sort();
  completion.sort();
  let answer = [];
  for (let i = 0; i < participant.length; i++) {
    if (participant[i] !== completion[i]) {
      answer = participant[i];
      return answer;
    }
  }
}

solution(["mislav", "stanko", "mislav", "ana"], ["stanko", "ana", "mislav"]);

** ansers.js 에서...**

sort 후 participant와 completion 의 index를 비교하면 될 일이었다... 
효율성과 정확성테스트... ㅜㅜ

[codesandbox] https://codesandbox.io/s/coding-test-daily-33-p2f927