티스토리 뷰

반응형

콜백함수

콜백함수는 다른코드의 인자로 넘겨주는 함수 입니다.

 

예제로서는  자바스크립트 내부메서드 setInterval이 있습니다.

let intervalID = scope.setInterval(func, delay[ param1,param2, ... ]);

setInterval은 매 delay 마다, 반복적으로 실행하는 메서드로서, 변수에 담은이유는 반복 실행되는 중간에 종료 ( ClearInterval ) 를 하기위해서입니다.

 

let count = 0;
let cbFunc = funtion() {
	console.log(count);
    if( ++count > 4 ) clearInterval(timer);
};
let timer = setInterval(cbFunc, 1000);

 

이처럼 콜백 함수의 제어권을 넘겨 받은 코드는 콜백 함수 호출 시점에 대한 제어권을 가지는데,

즉 넘겨 받은 코드는 콜백 함수를 호출할 때 인자에 어떤 값들을 어떤 순서로 넘길 것인지에 대한 제어권을  가진다고 보면 이해하기 쉬울것같습니다. 

 

 콜백 함수는 객체 내 메서드일경우함수와 , 메서드 함수의 인자로서 실행되는 함수 자체의 기능을 가지는 경우가 있는데 이는 다음과 같습니다.

 

let obj = {
	vals : [1,2,3],
    logVal: function(v,i){
    	console.log(this,v,i);
    }
}

obj.logVal(1,2) <--- 1
[4,5,6].forEach(obj.logVal); <--- 2

1,2번을 비교하면 1번은 객체로서의 메서드로 실행이되고,

2번은 메서드에 의해 함수자체만 실행이 되는 플로우입니다. 

어떤함수에 인자로 메서드를 전달하더라도 결국 함수로서 실행이됩니다.

* 사용자 임의로 this를 바꾸고싶으면, bind메서드를 활용하면 바꿀수있습니다.

 

 

콜백함수를 인자로 계속 넣어주게 되면 다음과 같은 가독성이 심하게 떨어지는 코드가 나오가 되는데.

이를 개발자들은 콜백 지옥 이라고 부르기로 했습니다.

이를 해결하기 위한 방법으로는 promise, async/await 함수를 사용하여, 

현재 실행중인 코드와 무관하게 다음 코드로 넘어가는 비동기 방식이있습니다. 

위에 문법들은 다음 TIL에 자세하게 살펴보도록 하고 이것으로 콜백함수에 대한 TIL을 마치겠습니다.

 

HTTP (HyperText Transfer Protoco)

HPPT 는 텍스트 기반의 통신 규약으로 인터넷에서 주고받을 수 있는 프로토콜이다.
Tip. protocol : 프로토콜은 컴퓨터 내부에서, 또는 컴퓨터 사이에서 데이터의 교환 방식을 정의하는 규칙

 

교환이라함은 요청과 응답이 되겠다.

 

요청(Request)  : 프론트엔드(클라이언트) 에서 백엔드(서버)에 보내는 메시지

 

  • GET:  데이터를 서버로부터 받아올 때
  • POST: 데이터를 생성, 수정할 때
  • PUT:  존재하는 자원에 대한 변경
  • DELETE: 존재하는 자원에 대한 삭제 메소드

 

응답(Response) : 요청과 동일하게 서버가 클라이언트에 보내는 메시지

200(성공) 200번대의 상태 코드는 대부분 성공을 의미
300(리다이렉션) 대부분 클라이언트가 이전 주소로 데이터를 요청해,
서버에서 새 URL로 리다이렉트를 유도하는 경우
400(클라이언트 에러) 400번대 상태 코드는 대부분 클라이언트의 코드가 잘못된 경우
유효하지 않은 자원을 요청했거나 요청이나 권한이 잘못된 경우 발생
500(서버 에러) 500번대 상태 코드는 서버 쪽에서 오류가 난 경우

 

반응형
댓글
공지사항
반응형