JS 기초_06 (Functions)

Functions (함수)

함수 in JavaScript

• 참조 타입 중 하나로써 function 타입에 속함

• 자바스크립트에서 함수를 정의하는 방법은 주로 2가지로 구분

  • 함수 선언식 (function declaration)
  • 함수 표현식 (function expression)

• 자바스크립트의 함수는 일급 객체에 해당

  • 일급 객체 : 다음 조건들을 만족하는 객체를 의미함

    • 변수에 할당 가능
    • 함수의 매개변수로 전달 가능
    • 함수의 반환 값으로 사용 가능

함수 선언식 (function statement, declaration)

• 함수의 이름과 함께 정의하는 방식

• 3가지 부분으로 구성

  • 함수의 이름 (name)
  • 매개변수 (args)
  • 몸통 (중괄호 내부)

함수 표현식 (function expression)

• 함수를 표현식내에서 정의하는 방식

• 함수의 이름을 생략하고 익명 함수로 정의 가능

  • 익명 함수 : 이름이 없는 함수
  • 익명 함수는 함수 표현식에서만 가능

• 3가지 부분으로 구성

  • 함수의 이름 (생략 가능)
  • 매개변수 (args)
  • 몸통 (중괄호 내부)

기본 인자 (default arguments)

• 인자 작성시 '=' 문자 뒤 기본 인자 선언 가능

함수 선언식, 표현식 비교 정리

	함수 선언식	함수 표현식
공통점	데이터 타입, 함수 구성 요소 (이름, 매개변수, 몸통)	데이터 타입, 함수 구성 요소 (이름, 매개변수, 몸통)
차이점	익명 함수 불가능 호이스팅 O	익명 함수 가능 호이스팅 X
비고		Airbnb Style Guide 권장 방식

함수의 타입

• 선언식 함수와 함수식 함수 모두 타입은 funtion으로 동일

호이스팅

함수 선언식 호이스팅

• 함수 선언식으로 선언한 함수는 var로 정의한 변수처럼 hoisting 발생
• 함수 호출 이후에 선언 해도 동작

함수 표현식 호이스팅

• 함수 표현식으로 선언한 함수는 함수 정의 전에 호출 시 에러 발생
• 표현식 함수는 변수로 평가되어 변수의 scope 규칙을 따름

• 함수 표현식을 var 키워드로 작성한 경우, 변수가 선언 전 undefined로 초기화 되어 다른 에러가 발생

화살표 함수 (Arrow Function)

• 함수를 비교적 간결하게 정의할 수 있는 문법
• function 키워드 생략 가능
• 함수의 매개변수가 하나 뿐이라면, ( )도 생략 가능
• 함수 몸통이 표현식 하나라면 { }과 return도 생략 가능