위클리 페이퍼 (5)

깨진알·2023년 12월 21일

목록 보기

5/14

5주차 위클리 페이퍼

Q1) HTTP 메소드에 대해 설명해 주세요.

1. GET 메소드

GET 메소드는 리소스를 조회할 때 사용하는 메소드이다. GET 요청이 성공적으로 이루어진다면 XML이나 JSON과 함께 200 HTTP 응답 코드를 리턴한다. GET 요청은 단순히 데이터를 조회하는데 사용되며, 멱등적이다. (멱등적이란, 여러번 수행해도 결과가 같음을 의미한다. 즉, 호출로 인하여 데이터가 변형이 되지 않는 상태를 의미한다.) 그렇기 때문에 같은 요청을 여러 번 하더라도 변함없이 항상 같은 응답을 받을 수 있다.

2. POST

POST 메소드는 리소스를 추가하거나 생성할 때 사용된다. 정확히 말하자면 하위 리소스(부모 리소스의 하위 리소스)들을 생성할 때 사용된다. POST 메소드는 멱등적이지 않기 때문에, 같은 POST 요청을 반복했을 때 같은 결과가 나오지 않을 수 있다. 또한 두 개의 같은 POST 요청을 보내면 같은 정보를 담은 두 개의 다른 리소스를 반환할 가능성이 있다. 성공적으로 이루어지면 201 HTTP 응답을 반환한다.

3. PUT

PUT 메소드는 리소스를 수정하는데 사용되며, 리소스를 생성하고 업데이트하기 위해 서버로 데이터를 보내는데 사용된다. PUT 메소드는 멱등적이기 때문에 동일한 PUT 요청을 여러 번 호출하면 항상 동일한 결과가 생성된다. PUT 메소드로 이미 존재하는 기존 리소스를 삭제하고 덮어쓸 수 있다.

4. DELETE

DELETE 메소드는 리소스를 삭세하는데 사용된다. 데이터를 삭제하기 때문에 Body값과 Content-Type 값이 비워져 있다.

5. PATCH

PATCH 메소드는 PUT 메소드와 비슷하게 리소스를 수정하는데 사용되지만, PUT 메소드는 리소스 전체를 변경할 때 사용되는 반면, PATCH 메소드는 리소스 일분 부분만을 변경할 때 사용된다. (PATCH 메소드를 지원하지 않는 서버에서는 POST 메소드를 대신 사용할 수 있다.)

6. HEAD

HEAD 메소드는 GET 메소드와 비슷하게 리소스를 조회할 때 사용되지만, 서버에서 Body를 리턴하지 않는 특징이 있다. 일반적으로 응답의 상태 코드만 확인할 때와 같이 리소스를 받지 않고 찾기만을 할때 사용한다. (일종의 검사 용도라고 보면 된다.) HEAD 메소드를 사용해서 서버의 응답 헤더를 봄으로써 리소스가 수정 되었는지 확인할 수 있다.

7. TRACE

TRACE 메소드 또한 검사를 하기 위한 메소드로, 서버에 도달했을 때 최종 패킷의 요청 패킷 내용을 응답받을 수 있다. 요청의 최종 수신자는 송신자아게 200 HTTP 응답의 내용(Body)로 메시지를 반송해야 한다. 클라이언트의 요청 패킷이 방화벽, Proxy 서버, Gateway 등을 거치면서 패킷의 변조가 일어날 수 있는데, TRACE 메소드를 사용하여 요청했던 패킷 내용과 응답 받은 요청 패킷 내용을 비교하여 변조 유뮤를 확인할 수도 있다.

8. OPTION

OPTION 메소드는 예비 요청(Preflight)에 사용되는 메소드로, 예비 요청은 본 요청을 하기 전에 안전한지 미리 검사하는 요청을 의미한다. OPTION 메소드는 서버의 지원 가능한 HTTP 메소드와 출처를 응답 받아 CORS 정책을 검사하는데 사용된다.

Q2) 예시의 코드를 실행할 때, 콘솔에 출력될 값과 그 이유를 설명해 주세요.

// 1번
let num = 1;

// 2번
setTimeout(() => {
  num = 2;
}, 0);

// 3번
num = 3;

// 4번
console.log(num);

우선 결과적으로는 콘솔에 3이 출력된다. 결과를 설명하기 위해 우선 자바스크립트의 동작 원리에 대해 간략히 설명하도록 하겠다.

자바스크립트는 싱글 쓰레드 언어이다. 쓰레드란, 운영체제에서 실행중인 하나의 프로그램을 프로세스라 하며 이 프로세스의 작은 단위를 의미한다. 쓰레드는 단 한개의 일만을 처리하며, 이러한 쓰레드가 여러 개 모여 프로세스가 된다. 싱글 쓰레드와 달리, 두 개 이상의 프로세스는 멀티 프로세스, 그리고 이렇게 여러 일을 동시에 하는 것을 멀티 테스킹이라고 한다. 즉, 자바스크립트는 한번에 한개의 일만 처리한다.

자바스크립트 동작 원리에 대해서 필요한 개념 중 하나는 콜스택(CallStack)이다. 콜스택은 현재 실행중인 함수에 대한 정보들을 담아두는 스택 구조의 메모리 영역을 의미한다. 즉, 콜스택은 프로세스가 어느 단계에 있는지를 기록하게 된다.

const function2 = (x, y) => {
    return console.log(x + y);
}
const function1 = (a, b) => {
  function2(a, b)
}

function1(1, 2); // 실행

위 사진처럼 순서대로 위에 쌓인 스택은 위에서부터 처리가 되며 하나씩 삭제가 된다.

또한 브라우저에서 제공하는 Web API라는 것도 있다. (페이지에 Web API 참고) 콜스택에서 불러온 함수가 비동기적인 함수이면 Web API를 통해 Run 함수를 호출하게 된다. 그리고 Web API에서 처리가 끝난 함수는 Callback Queue로 이동한다.

Callback Queue(Event Queue, Task Queue)는 Web API에서 보내진 비동기 처리가 모이는 곳으로 콜스택과는 다르게 먼저 들어온 것이 먼저 나가게 된다. (콜스택이 후입선출이면 콜백큐는 선입선출이다.) 이곳에 있는 비동기 함수들은 이벤트 루프의 감시 하에 놓이게 된다.

Event Loop가 자바스크립트 동작에 있어서 중요한 일을 처리하는 개념이다. Event Loop은 단 한개만의 일을 수행하는데, 바로 콜스택과 큐를 감시하는 것이다. 만약 콜스택이 비어있게 되면 큐에 쌓인 비동기 함수를 콜스택으로 보내주는 역할을 한다. 또한 콜스택이 비어있을 때는 콜백큐에 쌓여있는 비동기 함수 중 가장 먼저 들어온 함수를 보내준다. 이러한 해동을 틱(tick)이라고 하며, 이벤트 루프를 통해 비로소 동기 함수와 비동기 함수의 순서가 정해지게 된다.

이 개념들을 정리하고 나서 위의 코드를 설명하자면 2번에서 setTimeout을 Web Api가 처리하게 두지만, 즉시 처리하지는 않게 된다. setTimeout 등록이 다 되었으면 Web API는 콜백큐로 넘겨주게 된다. 그리고 3, 4번에서 3을 출력하고 나서야 이벤트 루프를 통해 콜백큐에 있는 함수를 콜스택으로 가져와 2가 변수 num에 할당되는 것이다.