함수

자바스크립트 함수는 반드시 return값이 존재하며, 없을때는 기본 반환값인 'undefined'이 반환된다.

 

함수 선언식

function 함수명() {
  구현 로직
}

// 예시
function test(){
	console.log("함수 선언식");
}

test(); // '함수 선언식' 출력

함수 표현식

var 함수명 = function(){
	구현 로직
};

// 예시
const test = function(){
	console.log("함수표현식");
}

test(); // '함수표현식' 출력

 

함수 선언식과 함수 표현식 차이점

함수 선언식은 호이스팅에 영향을 받지만, 함수 표현식은 호이스팅에 영향을 받지 않는다.

hoisting(호이스팅): 자바스크립트 함수는 실행되기 전에 함수안에 필요한 변수값들을 미리 다 모아서 선언한다. 함수 안에 있는 변수들을 모두 끌어올려서 선언한다.

 

예시코드

// 함수 선언식
function test() { 
	console.log(print()); 
	 function print() {
		return '함수의 선언 호이스팅';
	}
}

test() // '함수의 선언 호이스팅' 출력

// 함수 표현식
function test() { 
	console.log(print()); // print가 실행되는 순간 'undefined'으로 지정
	const print = function() {
		return '함수 표현식';
	}
}

test();
// ReferenceError: print is not defined

// ReferenceError: print is not defined

 

에러 이유 : 함수를 값으로 가지지만 어쨋든 print도 변수라서 끌어올려지게 되고, 값이 할당되기 전에 실행됐음으로 undefined이 할당된 상태이다. 

 

arguments 속성

함수가 실행되면 그 안에서 arguments라는 특별한 지역변수가 존재한다. 자바스크립트 함수는 선언한 파라미터보다 더 많은 인자를 보낼 수도 있다. 이때 넘어온 인자를 arguments로 배열의 형태로 하나씩 접근할 수가 있다. arguments는 배열타입은 아니다. 따라서 배열의 메서드를 사용할 수가 없다. 자바스크립트의 가변인자를 받아서 처리하는 함수를 만들때 등에서 arguments속성을 유용하게 사용할 수가 있다.

function a() {
 console.log(arguments);
}
a(1,2,3);

 

 

# 해볼만한 것(1~무한대까지 인자를 받아 합을 구하는 함수를 만들어보자)

function sum(one, ...theArgs) {
  let sum = one;
  theArgs.forEach(x => (sum += x));
  return sum;
}

console.log(sum(1, Infinity));