Function(함수)의 종류와 활용

들어봤는지는 모르겠지만 JavaScript의 Function에는 First-class Object(1급 객체)라는 이름이 붙는다.

왜 Function이 1급 객체라는 이야기가 붙는지, 그러한 함수의 종류에는 무엇이 있는지 알아보자.

우선 1급 객체란 무엇인지에 대해 알아보자.

💡

1. 변수에 저장이 가능하다. 2. 함수의 파라메터(Parameter)로 전달 할 수 있다. 3. 함수의 return 값으로 사용할 수 있다. 4. 자료 구조(Object, Array 등)에 저장할 수 있다.

작성일 기준 Java나 C 등의 프로그래밍 언어에서는 위 조건에 부합하지만, JavaScript는 모두 적합하다.

이러한 특징을 가진 Function을 정확하게 짚고 넘어가는 것이 좋은 코드를 작성하는 데에 도움이 될 것이라 생각한다.


function call(value) {
  // your code
}
call('value'); // execute your code

위의 방법은 가장 기초적인 Function의 선언 방법이다.

만약 ES6 이상을 사용한다면, Arrow Function을 사용하여 선언할 수 있다.


// Arrow Function
const call = value => {
  // your code
}
call('value');

function 뒤에 이름을 작성하여 이름을 지정하고 () 안에 인자를 넣는 방식으로 작성하며,

함수를 실행하기 위해서는 call() 혹은 call('value')처럼 실행시킬 수 있다.

위 First-class Object 1번 조건, "변수 저장이 가능하다"에 적합하도록 변경해본다면,


var call = function() {
  // your code
}

let call = function() {
  // your code
}

const call = function() {
  // your code
}

const call = () => {
  // your code
}

call();

이와 같이 작성할 수 있다.

이 것을 익명 함수(Anonymouse Function)라고 칭하며, 함수 선언시 자주 사용되는 문법이다.

함수 호출 역시 일반 함수와 똑같이 call()을 이용하면 된다.

만약 로드시 바로 실행되는 함수를 작성하려면 어떻게 작성해야 할까?


function call() {
  // initialize
}
call();

위와 같이 함수를 선언하고 바로 호출하는 방법이 있으나, 더 좋은 방법이 존재한다.


(function() {
  // initialize
}());

(function() {
  // initialize
})();

이와 같이 작성할 수 있는데, 이 함수를 즉시 실행 함수(Immediately-invoked function expresstion, IIFE)이라고 한다.

런타임시 함수를 저장하지 않고 해석 후 실행되기 때문에 나중에 다시 호출할 수 없다.


const func = (function() {
  return {
    val: 'test',
  }
})();

console.log(func.val);

런타임에 저장하지 않고 바로 실행되는 장점에 덕분에 정상 실행시에는 return된 값에 바로 접근할 수 있다.


(function(value) {
  console.log(value); // 'IIFE Test 1'
}('IIFE Test 1'));

(function(value) {
  console.log(value); // 'IIFE Test 2'
})('IIFE Test 2');

뒤의 괄호에 대해 궁금할 수 있는데, IIFE 안의 함수에 인자를 전달할 때 사용된다.

다람쥐 헌 쳇바퀴에 타고파

Function(함수)의 종류와 활용