[취업준비일지] - 127

1.msw가 네트워크로 가는 요청을 대신 받게 하기 위해 
중간에서 네트워크로 가는 요청을 탈취해줄 필요가 있는데
setupTests.js 파일 내부에서 아래와 같은 방식으로 처리할 수 있다.

import '@testin-library/jest-dom'
//위는 파일 기본 설정, 아래는 MSW를 위한 설정
import { server } from './mocks/server.js'
beforAll( () => server.listen() )
afterEach( () => server.resetHandlers() )
afterAll( () => server.close() )

2.서버에서 데이터를 가져오는 과정 자체가 비동기적으로 처리되기 때문에
MSW를 사용한다고 하더라도 테스트를 할 떄 비동기처리를 해야 한다.
비동기 처리 방식은 이전 처리와 같이 각각의 screen 등을 가져올 떄 await를 걸어주면 된다.


3.트랜지스터를 통해 true, false를 만드는 것은 간단하고(on/off)
and를 만드는 것 또한 두개를 직렬로 연결하면 되지만
or을 구현하기 위해서는 시작점이 두 갈래로 갈라진 다음 각자 a,b로 들어가고
그 결과가 도착점으로 넘어가는 형태로 구성된다.

그리고 xor의 경우에는 or과 같지만 둘 다 true일 경우 false가 출력되기 때문에
기존의 or연산자와 and연산자를 각각 계산한 다음 
and 연산자의 결과가 false일 때 ture가 출력되게 만든 다음
Not and의 결과와 or의 결과를 and 처리해 얻을 수 있다.

xor을 만들기 위해서는 not, and, or을 이해하고 있어야 하지만
xor은 상당히 유용하다고 한다.

xor까지 만든 시점에서 반가산기를 만들 수 있고
이를 통해 덧셈이 가능해지는데
현재 자릿수는 xor을 통해 결정하고
다음 자릿수에 1을 더할지 여부는 and를 통해 결정한다.
1+1이라고 한다면 xor = 0, and = 1로 10(이진)이 되며
1+0 또는 0+1이라고 하면 xor = 1, and = 0으로 01 => 1이 된다.
마지막으로 0+0은 당연히 0, 0으로 0이 된다

예를 들어 and는 아래처럼 직선으로 분기되지만

start -> a(false) -> b => false
start -> a(true) -> b(false) => false
start -> a(true) -> b(true) => true

or의 경우 두 갈래로 나뉜 것 중 하나라도 true가 되면 목적지까지 도착할 수 있기 때문에
둘 중 어떤 것이 true라도 true가 출력된다.

             ↱ a(false) ↘
start ->                   ↣  => false
             ↳ b(false) ↗

             ↱ a(true)  ↘
start ->                   ↣  => true
             ↳ b(false) ↗
            
             ↱ a(false) ↘
start ->                   ↣  => true
             ↳ b(true)  ↗
             
             ↱ a(true) ↘
start ->                   ↣  => true
             ↳ b(true) ↗

xor의 경우 위에서 한 or과 위로 빠지는 and연산의 반대(not)를 다시 조합해
and처리를 하는 과정으로 출력한다.

                        ↱ false => ! => true(not and result)
                 ↱ a(false) ↘                ↓  (start final and process)
start(or)  ->         ↑          ↣  => false(or result)
                 ↳ b(false) ↗                ↓
                      ↑                 false(xor result)
                   start(and)

                        ↱ false => ! => true(not and result)
                 ↱ a(true)  ↘                ↓  (start final and process)
start(or)  ->         ↑          ↣  => true(or result)
                 ↳ b(false) ↗                ↓
                      ↑                 true(xor result)
                   start(and)

                        ↱ false => ! => true(not and result)
                 ↱ a(false) ↘                ↓  (start final and process)
start(or)  ->         ↑          ↣  => true(or result)
                 ↳ b(true)  ↗                ↓
                      ↑                true(xor result)
                   start(and)

                        ↱ true => ! => false(not and result)
                 ↱ a(true) ↘                 ↓  (start xor to downSide)
start(or)  ->         ↑          ↣  => true(or result)
                 ↳ b(true) ↗                 ↓
                      ↑                 false(xor result)
                   start(and)

(메모장과 형태가 달라 수정이 복잡했다...)

마지막으로 반가산기는 위의 처리과정과 유사하지만 위로 올라가는 계산인
start(and)의 and 결과가 다음 자리 숫자가 되고
xor의 결과가 현재 자릿수라고 보면 된다.

  (다음 자리 0을 의미한다)↱ @false@ => ! => true(not and result)
                 ↱ a(false) ↘                ↓  (start final and process)
start(or)  ->         ↑          ↣  => false(or result)
                 ↳ b(false) ↗                ↓
                       ↑                 @false@(xor result)
                   start(and)           (현재 자리 0을 의미한다)

(1).백준 1260번 DFS와 BFS는 해당 그래프를 제공하고 시작점을 알려줄 경우
시작점에서부터 DFS와 BFS로 탐색한 결과를 출력하는 문제였다.
이론적으로는 그렇게 까다롭지 않았지만 
예전에 시도했다가 결과는 맞고 typeError가 났던 문제인데 

런타임 에러는 힌트가 적어 잡기 어렵다..

이전에 작성한 코드에서 string과 혼합된 계산이 있는 경우 Number로 바꿔주고
sort 부분의 값도 수정하니 88%까지는 진행되었지만 typeError는 그대로였다.

 

제일 답답한 부분은 JS환경에서는 정상적으로 처리되기 때문에

snippet이나 js 실행 테스트 또는 vsc에 작동시켜도 정상적으로 동작하지만

백준에서는 에러 지점을 보여주지 않고 타입에러라고만 출력된다는 것이었다.

 

근원적인 런타임의 원인과 조건들에 대해서도 확인해보다가
여기서는 엣지케이스를 테스트하지 않았던 문제였던걸로 파악되었다.

노드에서 연결된이라는 말에 당연히 연결될거라고 생각했기 때문에
해당 노드에서 연결되는 부분이 있다고 보고 stack.push(...obj[node])를 사용했는데
시작지점에서 연결된 노드가 하나도 없을 경우 초반 노드추가에서 추가된 것이 없어서
에러가 발생했던 것이다.

결국 시작점에서 뻗어가는 노드가 없는 경우를 if(obj[startNum])로 체크해
노드가 없을 경우 시작숫자를 출력하고
노드가 있을 경우 기존 방식대로 처리하니 통과되는 것을 볼 수 있었다.

const input = `3 1 1
2 3`.split('\n')

let obj = {}
const [vertex, nodes, startNum] = input[0].split(' ').map(Number)
for(let i = 1 ; i < input.length ; i++){
    let [a,b] = input[i].split(' ').map(Number)
    if(obj[a]){
        obj[a].push(b)
    }
    else{
        obj[a] = [b]
    }
    if(obj[b]){
        obj[b].push(a)
    }
    else{
        obj[b] = [a]
    }
}

for(let key in obj){
    obj[key] = obj[key].sort((a,b) => b-a)
}

const dfs = (start) => {
  const stack = [start];
  const visited = Array(vertex + 1).fill(false);
  const order = [];
  while (stack.length) {
    const node = stack.pop();
    if (!visited[node]) {
      visited[node] = true;
      order.push(node);
      stack.push(...obj[node]);
    }
  }
  return order.join(' ');
};

const bfs = (start) => {
  const queue = [start];
  const visited = Array(vertex + 1).fill(false);
  const order = [];
  while (queue.length) {
    const node = queue.shift();
    if (!visited[node]) {
      visited[node] = true;
      order.push(node);
      queue.push(...obj[node]);
    }
  }
  return order.join(' ');
};
if(obj[startNum]){
  console.log(dfs(startNum))
  
  for(let key in obj){
      obj[key] = obj[key].sort((a,b) => a-b)
  }
  console.log(bfs(startNum))
}
else{
  console.log(startNum)
  console.log(startNum)
}