함수 만들기와 호출하기

코드에 이름을 붙입니다

1부에서는 변수로 값에 이름을 붙였습니다. 함수는 코드에 이름을 붙입니다. 한 번 만들어 두면 필요할 때마다 그 이름으로 부릅니다.

function 이름(매개 변수) {
	할 일
	return 돌려줄 값;
}

매개 변수(parameter) 는 부를 때 받아 오는 값이고, return 은 돌려주는 값입니다. 둘 다 없어도 됩니다.

인사말 함수

function greet(name) {
	return `${name}님 안녕하세요`;
}

console.log(greet("홍길동"));
console.log(greet("김철수"));

만드는 것과 부르는 것은 다릅니다. function 으로 적은 부분은 만들어 두기만 하고 실행되지 않습니다. greet("홍길동") 처럼 이름 뒤에 괄호를 붙여야 그때 실행됩니다.

매개 변수가 여럿일 때

쉼표로 구분해 적습니다. 부를 때 넘기는 차례가 곧 받는 차례입니다.

function area(width, height) {
	return width * height;
}

console.log(area(3, 4));
console.log(area(10, 5));

돌려주지 않는 함수

return 이 없으면 undefined 를 돌려줍니다. 화면에 내보내기만 하고 값이 필요 없는 함수가 그렇습니다.

function shout(text) {
	console.log(text + "!");
}

const result = shout("안녕");
console.log(result);

return 을 만나면 함수가 그 자리에서 끝납니다. 뒤에 적은 줄은 실행되지 않습니다.

이름만 적으면 무엇이 나오나

괄호를 빠뜨리면 함수가 실행되지 않고 함수 자체가 나옵니다. 오류가 나지 않아 알아채기 어렵습니다.

function greet() {
	return "안녕하세요";
}

console.log(greet);
console.log(greet());

처음에 자주 걸리는 것

function area(w, h) {
    console.log(w * h);   // 화면에는 나오지만 돌려주지는 않습니다
}

const size = area(3, 4);   // size 는 undefined 입니다

직접 해보기

이 단원의 정리