Hi

(javascript) 함수 정의 본문

WEB(웹)

(javascript) 함수 정의

SharingWorld 2018. 6. 21. 12:08
함수 정의

함수 정의

함수를 생성하는 방법 3가지

  • 함수 선언문
  • 함수 표현식
  • Function() 생성자 함수

함수 리터럴

함수도 일반 객체처럼 값으로 취급된다.


함수 리터럴을 이용해 함수를 생성할 수 있다.

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

함수 리터럴은 네 부분으로 구성

  1. function 키워드
  2. 함수명(선택사항)
  3. 매개변수 리스트 : 매겨변수 타입을 기술하지 않음
  4. 함수 몸체

함수 선언문 방식으로 함수 생성하기

함수 리터럴 형태.
반드시 함수명이 정의되어 있어야 한다.


C에서 사용하는 함수 정의 방법과 유사.
차이점 - function이라는 키워드를 명시적으로 사용, 변수 타입(int, char등) 을 기술 하지 않는다.

// add() 함수 선언문
function add(x, y) {
	return x + y;
}

console.log(add(3, 4)); // 7

함수 표현식 방식으로 함수 생성하기

함수도 하나의 값처럼 취급된다. -> 함수는 일급객체


함수도 숫자나 문자열처럼 변수에 할당하는 것이 가능.


함수 표현식 : 함수 리터럴로 하나의 함수를 만들고, 생성된 함수를 변수에 할당하여 함수를 생성하는 것

// add() 함수 표현식
var add = function(x, y) { // add는 함수 이름이 아님! (함수)변수다.
	return x + y;
};

var plus = add;

conloe.log(add(3, 4)); // 7
console.log(plus(5, 6)); // 11

함수표현식에서 함수 이름을 쓰게 되는 경우는 내부에서 재귀적 호출이나, 디버거 등에서 함수를 구분할 때 사용한다.
var factorialVar = function factorial(n) {
	if (n <= 1) {
		return 1;
	}
	return n * factorial(n-1);
};

console.log(factorialVar(3)); // 6
console.log(factorial(3)); // Uncaught ReferenceError: factorial is not defined

함수 표현식 방식에서의 세미콜론 사용을 강력하게 권고

Function() 생성자 함수를 통한 함수 생성하기

함수도 Function()이라는 기본 내장 생성자 함수로부터 생성된 객체라고 볼 수 있다.


리터럴 방식으로 함수를 생성하지만, 내부적으로는 Function() 생성자 함수로 함수가 생성된다.
var add = new Function('x', 'y', 'return x + y');
console.log(add(3, 4)); // 7

잘 안쓰기 때문에 상식수준으로 알기

함수 호이스팅

더글러스 클락포드는 함수 표현식만을 사용할 것을 권하고 있다.

그 이유중의 하나가 ‘함수 호이스팅’

add(2, 3); // 5 "정상 작동함"

// 함수 선언문 형태로 add() 함수 정의
function add(x, y) {
	return x + y;
}

add(3, 4); // 7

함수 호이스팅

함수가 자신이 위치한 코드에 상관없이 함수 선언문 형태로 정의한 함수의 유효 범위는 코드의 맨 처음부터 시작한다.

함수 호이스팅이 발생하는 원인 : 자바스크립트의 변수 생성과 초기화의 작업이 분리돼서 진행되기 때문.

'WEB(웹)' 카테고리의 다른 글

웹스톰 전체 바꾸기  (0) 2018.06.21
(javascript) Object.keys()  (0) 2018.06.21
(javascript) 연산자  (0) 2018.06.21
기본 타입과 표준 메서드  (0) 2018.06.21
(javascript) 배열  (0) 2018.06.21