[JS] 일급 객체로서의 함수

《 함수 》의 내용을 먼저 알고 오면 좋을 것 같다.

---

▶ 일급 객체로서의 함수

• 일급 객체(First-Class Object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다.
• 자바스크립트에서 함수는 일급 객체라고 한다. 즉, 함수를 객체처럼 여러가지 방식으로 매우 유연하게 다룰 수 있다!

▷ 일급 객체의 조건

함수가 일급 객체로 취급되는 경우는 아래와 같다.

① 변수에 함수를 할당

• 다른 변수와 마찬가지로 변수에 할당할 수 있다. (함수 표현식)

• 변수에 할당된 함수는 나중에 사용할 수 있다.

const sayHello = function () {
  console.log("Hello!");
};

sayHello(); // "Hello!" 출력

② 다른 함수를 인자로 전달

• 다른 함수의 인자로 전달할 수 있다.

• 《 콜백(callback)함수 》나 고차 함수(higher-order function)를 작성하는 데 사용된다.

function callFunction(func) {
  // 매개변수로 받은 변수가 함수다.
  func();
}

const sayHello = function () {
  console.log("Hello!");
};

callFunction(sayHello); // "Hello!" 출력

③ 다른 함수에서 반환

• 다른 함수에서 반환할 수 있다. 즉, 리턴을 함수로 할 수 있다.

• 함수 팩토리(factory)나 《 클로저(closure) 》를 작성하는 데 사용된다.

function createAdder(num) {
  return function (x) {
    return x + num;
  };
}

const addFive = createAdder(5);
console.log(addFive(10)); // 15 출력

④ 객체의 프로퍼티로 함수를 할당

• 함수는 객체의 프로퍼티로 할당될 수 있다.

• 객체의 메소드로 함수를 호출할 수 있다.

const person = {
  name: "sieun",
  sayHello: function () {
    console.log(`Hello, my name is ${this.name}`);
  },
};

person.sayHello(); // "Hello, my name is sieun" 출력

⭐ “화살표 함수는 this를 바인딩 하지 않는다.”는 것을 꼭 기억하자!!!

const person = {
  name: "sieun",
  sayHello: () => {
    console.log(`Hello, my name is ${this.name}`);
  },
};

person.sayHello(); // "Hello, my name is undefined" 출력

⑤ 배열의 요소로 함수를 할당

• 함수는 배열의 요소로 할당될 수 있다.
• 함수를 배열에서 사용할 수 있게 한다.

const myArray = [
  function (a, b) {
    return a + b;
  }, // 0번째 요소
  function (a, b) {
    return a - b;
  }, // 1번째 요소
];

console.log(myArray[0](5, 10)); // 15 출력
console.log(myArray[1](10, 5)); // 5 출력

아래와 같이 코드 리팩토링을 통해 코드를 간결하고 모듈화된 형태로 작성할 수 있다.

function multiplyBy(num) {
  return function (x) {
    return x * num;
  };
}

function add(x, y) {
  return x + y;
}

const multiplyByTwo = multiplyBy(2);
const multiplyByThree = multiplyBy(3);

const result = add(multiplyByTwo(5), multiplyByThree(10));
console.log(result); // 40 출력