값으로서의 함수와 콜백

값으로서의 함수와 콜백

function a(){} === let a =function (){} === let a = () => {}

위의 예제에서 함수 a는 변수 a에 담겨진 값이다. 또한 함수는 객체의 값으로 포함될 수 있다. 이렇게 객체의 속성 값으로 담겨진 함수를 메소드(method)라고 부른다.

a = {
  b: function () {},
};

 함수는 값이기 때문에 다른 함수의 인자로 전달 될수도 있다. 아래 예제를 보자.

function cal(func, num) {
  return func(num);
}

function increase(num) {
  return num + 1;
}

function decrease(num) {
  return num - 1;
}

alert(cal(increase, 1)); // 2

alert(cal(decrease, 1)); // 0

 

alert(cal(increase, 1));을 실행하면 함수 increase와 값 1이 함수 cal의 인자로 전달된다. 함수 cal은 첫번째 인자로 전달된 increase를 실행하는데 이 때 두번째 인자의 값이 1을 인자로 전달한다. 함수 increase은 계산된 결과를 리턴하고 cal은 다시 그 값을 리턴한다

 

함수는 함수의 리턴 값으로도 사용할 수 있다.

function cal(mode) {
  let funcs = {
    plus: function (left, right) {
      return left + right;
    },

    minus: function (left, right) {
      return left - right;
    },
  };

  return funcs[mode];
}

alert(cal("plus")(2, 1)); //3

alert(cal("minus")(2, 1)); //1

 

당연히 배열의 값으로도 사용할 수 있다.

let process = [
  function (input) {
    return input + 10;
  },

  function (input) {
    return input * input;
  },

  function (input) {
    return input / 2;
  },
];

let input = 1;

for (let i = 0; i < process.length; i++) {
  // 0,1,2

  input = process[i](input); //11, 121, 60.5
}

alert(input); //60.5

 

콜백

처리의 위임

값으로 사용될 수 있는 특성을 이용하면 함수의 인자로 함수로 전달할 수 있다. 값으로 전달된 함수는 호출될 수 있기 때문에 이를 이용하면 함수의 동작을 완전히 바꿀 수 있다. 인자로 전달된 함수 sortNumber의 구현에 따라서 sort의 동작방법이 완전히 바뀌게 된다.

let number = [20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1];

// 숫자 정렬하기 메서드 ,sort

let sortfunc = function (a, b) {

return a - b;

// 밑에 코드를 위에코드로 줄일수있다.

// if (a > b) {

// return 1;

// } else if (a < b) {

// return -1;

// } else {

// return 0;

// }

};

number.sort(sortfunc); // sortfunc 콜백함수

console.log(number); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 20]