본문 바로가기
개념 정리

this와 HTTP 메소드

by zerm 2023. 10. 8.

1. this

자바스크립트 내에서 this는 '누가 나를 불렀느냐'를 뜻한다. 즉, 선언이 아닌 호출에 따라 달라진다는 것이다.
- 단독으로 쓴 this
global object를 가리킨다. 브라우저에서 호출하는 경우 [object Window]가 된다.
- 함수 안에서 this
함수 안에서 this는 함수의 주인에게 바인딩됩니다.함수의 주인은 window객체이다. 다만, strict mode(엄격 모드)에서는 조금 다르다. 함수 내의 this에 디폴트 바인딩이 없기 때문에 undefined가 된다.

- 메소드 안에서 쓴 this

메소드 호출 시 메소드 내부 코드에서 사용된 this는 해당 메소드를 호출한 객체로 바인딩된다.

- 이벤트 핸들러 안에서 쓴 this

이벤트 핸들러에서 this는 이벤트를 받는 HTML 요소를 가리킨다.

- 생성자 안에서 쓴 this

생성자 함수가 생성하는 객체로 this가 바인딩 된다. 하지만 new 키워드를 빼먹는 순간 일반 함수 호출과 같아지기 때문에, 이 경우는 this가 window에 바인딩된다.

- 화살표 함수로 쓴 this

왜 함수 안에서 this가 전역 객체가 되가 싶을 땐 화살표 함수를 쓰면 된다. 화살표 함수는 전역 컨텍스트에서 실행되더라도 this를 새로 정의하지 않고, 바로 바깥 함수나 클래스의 this를 쓰기 때문이다.

 

2. HTTP 메소드

HTTP 메소드란 클라이언트와 서버 사이에 이루어지는 요청(Request)과 응답(Response) 데이터를 전송하는 방식을 일컫는다. 쉽게 말하면 서버에 주어진 리소스에 수행하길 원하는 행동, 서버가 수행해야 할 동작을 지정하는 요청을 보내는 방법이다. HTTP 메소드의 종류는 총 9가지가 있다. 이 중 주로 쓰이는 메소드는 5가지가 있다.

 

주로 쓰이는 메소드 5가지
- GET : 리소스 조회
- POST : 요청 데이터 처리, 주로 데이터 등록에 사용
- PUT : 리소스를 대체, 해당 리소스가 없으면 생성
- PATCH : 리소스를 일부만 변경
- DELETE : 리소스 삭제

GET은 보통 리소스를 조회할 때 사용하며, 서버에 전달하고 싶은 데이터는 query를 통해서 전달한다. 메시지 바디를 사용해서 데이터를 전달할 수는 있지만, 지원하지 않는 곳이 많아서 권장하지 않는다.
POST는 데이터 요청을 처리하고, 메시지 바디를 통해 서버로 데이터를 전달한다. 주로 신규 리소스를 등록하거나 프로세스 처리에 사용된다.
PUT은 리소스가 있으면 대체하고 리소스가 없으면 생성한다. 쉽게 말해 데이터를 덮어쓴다.
PATCH는 PUT과 마찬가지로 리소스를 수정할 때 사용하지만, PATCH는 리소스를 일부분만 변경할 수 있다.
DELETE는 리소스를 제거할때 사용한다.


기타 메소드 4가지
- HEAD: GET과 동일하지만 메시지 부분을 제외하고, 상태 줄과 헤더만 반환
- OPTIONS: 대상 리소스에 대한 통신 가능 옵션을 설명(주로 CORS에서 사용)
- CONNECT: 대상 자원으로 식별되는 서버에 대한 터널을 설정
- TRACE: 대상 리소스에 대한 경로를 따라 메시지 루프백 테스트를 수행


HTTP 메소드의 속성
1. 안전(Safe Methods)
 이 말은 계속해서 메소드를 호출해도 리소스를 변경하지 않는다는 뜻이다. 주요 메소드중에는 GET 메소드가 안전하다고 볼 수 있다.
2. 멱등(Idempotent Methods)
 이 말은 메소드를 계속 호출해도 결과가 똑같다는 뜻이다. Get, PUT, DELETE는 멱등하다고 볼 수 있지만 POST나 PATCH는 멱등하다고 볼 수 없다.
3. 캐시가능(Cacheable Methods)
 캐시가능하다는 말은 말 그대로 캐싱을 해서 데이터를 효율적으로 가져올 수 있다는 뜻이다. GET, HEAD, POST, PATCH가 캐시가 가능하지만 실제로는 GET과 HEAD만 주로 캐싱이 쓰인다고 한다.

'개념 정리' 카테고리의 다른 글

Virtual Dom, key  (0) 2023.10.22
코드 분석, Ajax란  (0) 2023.10.15
브라우저 동작 원리  (0) 2023.10.01
==과 ===의 차이, 얕은 복사와 깊은 복사  (0) 2023.09.24
merge 방법들과 Git Flow에 대해  (0) 2023.09.17