[Javascript 기초] 함수의 이해

함수는 자바스크립트 기본 구성 요소 중 하나입니다.

함수란 자주 쓰는 실행코드들을 블록단위 묶어서 패키징 해놓은 상태를 말하며,

자바스크립트 코드를 작성하 자주 쓰는 코드들을 기능 단위 재사용하기 위해서 존재합니다.

함수를 사용하기 위해서는 미리 function 키워드를 이용해 자주 쓸 코드들을 묶어서

정의해야 하고(함수 정의), 정의된 함수를 호출하여 기능을 실행할 수 있습니다.(함수 호출)

 

함수의 종류로는 다음과 같습니다.

1. 선언적함수

2. 익명함수

3. 대입형함수

4. 즉시실행함수

---

1. 선언적함수

선언적함수는 함수에 미리 이름을 붙여서 정의해 둔 형태입니다.

자바스크립트를 읽을 때 선언적함수를 우선으로 읽고, 호출 위치가 자유롭다는 특징을 가집니다.

//선언적함수
plus(); // (정상적으로 함수 호출), 3
function plus(){
  const num1 = 1;
  const num2 = 2;
  console.log(num1+num2);
}
plus(); // (정상적으로 함수 호출), 3

 

2. 익명함수

익명함수는 이름 없이 함수를 정의한 형태입니다.

익명함수 자체만으로 호출이 불가능하고, 변수에 익명함수를 대입하거나(대입형함수)

특정 이벤 객체에 대입하는 식으로 호출이 가능합니다.

//익명함수
function (){
  const num1 = 1;
  const num2 = 2;
  console.log(num1-num2);
}

 

3. 대입형함수

대입형함수는 변수에 익명함수가 대입된 형태입니다.

선언적함수와는 다르게 순차적으로 실행이 됩니다.

//대입형함수
minus(); // (함수 호출 불가)
const minus = function(){
  const num1 = 1;
  const num2 = 2;
  console.log(num1-num2);
}
minus(); // (정상적으로 함수 호출), -1

 

4. 즉시실행함수

즉시실행함수는 함수 정의와 동시에 즉시 호출하며, 익명함수를 사용하는 것이 일반적입니다.

즉시실행함수를 쓰는 이유는 즉시실행함수 내부의 값을 캡슐화하여 불필요한 전역 변수의 생성을 줄일 수 있고,

private 한 변수를 만들 수 있기 때문입니다.

*캡슐화 : 일반적으로 연관 있는 변수와 함수를 클래스로 묶는 작업, 은닉성으로 외부에서의 접근을 막아 중요한 데이터를 보존, 보호

 

즉시실행함수는 화살표함수로 축약시킬 수 있습니다.

//즉시실행함수
(function (){
  const num1 = 1;
  const num2 = 2;
  console.log(num1+num2);
 })();
 
 //화살표함수를 통한 축약형
 (() => {
   const num1 = 1;
   const num2 = 2;
   console.log(num1+num2);
 })();