3.함수를 만드는 법

SUN·2022년 8월 25일

모던자바스크립트

목록 보기
3/8

함수를 만드는 법

  1. 함수 선언식 -함수를 선언

    • 함수를 선언하기전에 함수를 호출 가능 (호이스팅)
  2. 함수 표현식 -함수를 변수에 선언

    • 함수 선언을 값처럼 사용하는 방식
    • 호이스팅 불가능
    • 변수의 성격을 가진다.
const printCode = function() {
	console.log('hello')
    }
    
printCode(); // hello

함수 표현식의 이름

함수 표현식에서도 이름을 줄 수가 있는데 이는 함수 내부에서 함수 자체를 가리킬 때 사용 가능하며 외부에서 호출 할 수 없다.

let countdown = function(n) {
	console.log(n);
   	if (n === 0) {
		console.log('End!');
	} else {
		countdown(n - 1);
	}
};

let myFunction = countdown;

countdown = null;

myFunction(5); // TypeError

6번줄에서 동작 수행할 때 호출하려는 countdown함수가 이미 12번에서 null 값으로 변경이 되었기 떄문에 함수가 아니라는 TypeError가 발생했다.

그래서 함수 내부에서 자신의 함수를 사용해야할 때는 함수표현식에서 기명 함수 표현식을 사용하는 것이 좋다.

let countdown = function printCountdown(n) {
	console.log(n);
    if (n === 0) {
		console.log('End!');
    } else {
    	printCountdown(n - 1);
    }
};

let myFunction = countdown;

countdown = null;

myFunction(5); // 정상적으로 동작

즉시 실행함수 (IIFE)

(function () {
	console.log('Hi!');
})();

위와 같이 함수 선언 부분을 소괄호로 감싸고 평소 함수를 실행하듯이 소괄호를 더 붙여주는 방식

  • 즉시 실행 함수는 함수에 이름을 주어도 외부에서 재사용이 불가능하다.

  • 일반적으로 이름을 사용하지 않지만 재귀적인 구조에서는 사용

    활용

  1. 선언과 동시에 이루어지기 때문에 일반적으로 프로그램 초기화 기능으로 사용

    (function init() {
    	// 프로그램이 실행 될 때 기본적으로 동작할 코드들..
    })();
  2. 재사용이 필요없는 일회성 동작을 구성할때 활용

const firstName = Young;
const lastName = Kang;

const greetingMessage = (function () {
	const fullName = `${firstName} ${lastName} `;
	return `Hi! My name is ${fullName}`;
})();
profile
안녕하세요!

0개의 댓글