[JavaScript] 자바스크립트 콜백 예시

콜백(CALLBACK)

함수는 무언가 일을 하고 난 후에 처리하는 함수인데 함수를 다 콜백이라고 한다.
콜백함수를 매개변수로 넘길수 잇다.

---

콜백을 알앗다면 "싱크 어싱크(동기(Sync) & 비동기(Async))" 를 알아야 한다.

1. 동기 : 하나의 요청이 오면 완료가 된 후 다음 요청을 실행하는 방식 - 순차적 로직흐름
2. 비동기 : 어떤 요청이 오면 완료가 되기 전에 다음 요청을 실행하는 방식 - 동시 효율적 처리 가능, 즉시 응답X 때문에 예상 밖 결과 나올수도 있다.

1. 동기(Sync:싱크)          => 순서대로 가는것
2. 비동기(Async:어싱크) => 순서없이 가는것 
비동기니까  a,b,c의 결과값을 순차적으로 가져올 수 없기 때문에 콜백이라는 함수를 ㅊ통해 끝나는 지점을 아니까
끝나는 지점에 완료값이 어떻게 나오는지 확인할 수 있게 CALLBACK 처리를 해준다.

---

자바스크립트 문법

function 함수(매개변수) { 실행문; }

 

문제

콜백 함수 변수정의 x = 5, y =10

a 가 하는일은 x,y 중 큰수를 알아낸다 (a가 트랜젝션이라 치고)
b 가 하는 일은 나는 " " 가 좋아요 출력 , 콘솔또는 넥사크로에서 트레이스로 출력
c 가 하는 일은 a 호출 뒤에 b를 호출 결국은 b만 호출되면됨

b가 콜백이되니까 b를 a에 던진다...

 

1-1 찍어보기 (기본 문장완성)

function transactionA(x = 5,y =10) {
    x() < y();
  }
  
  function b(value) {
    console.log('나는' + value +'가 좋아요');
  }


  function c() {
    console.log('아에이오우 이건 C');
  }

 

 

1-2 찍어보기  (콜백을 타기위한 문장완성)

function tt(x,y,fn_callback) {
      fn_callback(y);
  }

  function bb(value) {
    console.log('나는 큰수' + value +'가 좋아요');
    
  }
  function vv(value) {
     console.log('나는 작은수' + value +'가 좋아요');
  }
  
  tt(3,8,bb);  // x가3이고 y가 8 ->인풋값
  
  tt(10,5,bb);

  tt(3,1,vv);

 

 

1-3 정답  (콜백을 타기위한 문장완성)

// (x,y,fn_callback) => 이 안에 있는거는 파라미터 변수

// 변수를 이 안에서 정의하는데 
// y 하고 x 중에 큰수를 넣어서 콜백의 파라미터로 넣어준다
  function tt(x,y,fn_callback) {
    var bigint;

    if(x < y){
        bigint = y;
    } else {
        bigint = x;
    }

    fn_callback(bigint);
  }
  
  function bb(value) {
    console.log('나는 큰수' + value +'가 좋아요');
    
  }


  function vv(value) {
    console.log('큰수는 ' + value + '싫어요');
  }

  tt(3,8,bb);  // x가3이고 y가 8 ->인풋값
  
  tt(10,5,bb);

  tt(3,1,vv);