2023-11-07 본 캠프 24일차 / 43일차 TIL

2023-11-07 본 캠프 24일차 / 43일차 TIL

주요진행사항

- 알고리즘 문제풀이 (인프런)

- 리액트 숙련과정 강의 수강

 

1. 알고리즘 문제풀이 - 완전탐색 문제

완전 탐색 (블루투포스) 문제란 모든 경우의 수를 파악하여, 경우의 수 중 원하는 조건에 부합하는 것만 추출하는 문제이다.

문제 한개의 예시를 들며 문제를 풀이하겠다.

 

- 문제

현수네 반 선생님은 반 학생들의 수학점수를 향상시키기 위해 멘토링 시스템을 만들려고 합니 다. 멘토링은 멘토(도와주는 학생)와 멘티(도움을 받는 학생)가 한 짝이 되어 멘토가 멘티의 수학공부를 도와주는 것입니다. 선생님은 M번의 수학테스트 등수를 가지고 멘토와 멘티를 정합니다. 만약 A학생이 멘토이고, B학생이 멘티가 되는 짝이 되었다면, A학생은 M번의 수학테스트에서 모두 B학생보다 등수가 앞서야 합니다. M번의 수학성적이 주어지면 멘토와 멘티가 되는 짝을 만들 수 있는 경우가 총 몇 가지 인지 출력하는 프로그램을 작성하세요.

 

- 입력

첫 번째 줄에 반 학생 수 N(1<=N<=20)과 M(1<=M<=10)이 주어진다. 두 번째 줄부터 M개의 줄에 걸쳐 수학테스트 결과가 학생번호로 주어진다. 학생번호가 제일 앞에서부터 1등, 2등, ...N등 순으로 표현된다. 만약 한 줄에 N=4이고, 테스트 결과가 3 4 1 2로 입력되었다면 3번 학생이 1등, 4번 학생이 2등, 1번 학생이 3등, 2번 학생이 4등을 의미합니다.

(예제)

4 3

3 4 1 2

4 3 2 1

3 1 4 2

 

- 출력

첫 번째 줄에 짝을 만들 수 있는 총 경우를 출력합니다.

(예제)

3

 

- 풀이

function solution(n, m, arr) {
  let count = 0;
  for (let i = 1; i < n + 1; i++) {
    // (멘토 : i)
    mentorCheck: for (let j = 1; j < n + 1; j++) {
      // (멘토: i / 멘티: j )
      if (i === j) continue;
      for (let a = 0; a < m; a++) {
        // (멘토 :i/ 멘토:j) a번쨰 시험
        let i_th = 0;
        let j_th = 0;
        for (let b = 0; b < n; b++) {
          // a번째 시험 i 등수 : i_th / j 등수 : j_th
          if (arr[a][b] === i) i_th = b;
          if (arr[a][b] === j) j_th = b;
        }
        if (i_th > j_th) continue mentorCheck;
      }
      count++;
    }
  }
  return count;
}

console.log(
  solution(4, 3, [
    [3, 4, 1, 2],
    [4, 3, 2, 1],
    [3, 1, 4, 2],
  ])
);

 

1) 문제의 경우의 수 파악

문제는 학생들이 멘토링을 하는 전체 경우의 수이다. 따라서 학생수 n의 제곱에 본인끼리 묶일 4의 경우의 수를 뺀 n^2-n이다. 해당 경우를 모두 확인하기 위해 2중 반복문을 활용할 예정이다.

 

2) 경우의 수 해결방법 파악

각 경우의 수가 확인 되었다면, 해당 경우의 수마다 문제를 해결할 로직이 필요하다.

해당 경우에서는 m 번의 시험을 실시하고 해당 시험 마다 멘토는 멘티보다 높은 등수이면 안된다.

따라서 m번의 시험을 실시하기 위해 반복문을 이용하고 시험 마다 멘토와 멘티의 등수를 파악하기 위해서 반복문을 사용한다. 결론적으로 해당 문제는 4중 반복문을 이용하게 된다.

멘토와 멘티의 등수를 파악하고 조건문을 통해 만약 멘티의 등수가 멘토보다 낮게 나오면 (순위에서는 낮은게 잘본 것) 멘티를 지정하는 반복문을 continue 시킨다.

---

 

2. 리액트 강의 수강 요약

1) styled components

리액트 내에서 자바스크립트 코드로 CSS를 사용하기 위한 모듈이다.

해당 모듈이 강력한 이유는 자바스크립트의 삼항연산자, switch~case 문과 연계하여 조건에 따른 css를 변경시킬 수 있다는 점이다. 또한 css 자체를 컴포넌트화 하였기 때문에 재사용성도 좋다.

2) useState

컴포넌트 내의 상태를 변경할 수 있는 값

3) useEffect 

컴포넌트가 리런더링 될때 마다 실행되는 reack hook

4) useRef

state처럼 변경될 때 마다 리로드되지 않는 값

저장소의 역할을 하거나 Dom 구조를 지정하는 역할을 한다.

5) useContext

state Drill 현상을 개성하기 위한 hook으로 하위 컴포넌트로 값을 내려줄 때 중간 컴포넌트를 거치지 않고 전역에 값을 정해둔 것.