4/20 [JavaScript] 기초 - 함수

Kang, Shin Woo·2023년 4월 20일

CodeStates FE_45

목록 보기

8/11

함수 function

함수는 입력을 받아서 코드블록 내부의 코드를 실행한 후 함수의 실행결과를 반환하는 일련의 과정의 묶음입니다.
먼저, 함수 외부에서 특정한 입력값을 전달하여 호출할 수 있습니다. 함수가 호출되면 함수의 내부의 코드가 실행됩니다. 그리고 함수의 실행결과는 다시 함수 외부로 반환(return)할 수 있습니다.
함수를 사용한다는 것은 특정한 코드실행 과정을 하나의 묶음으로 묶어서 필요할 때마다 호출하여 실행한다는 것을 의미합니다. 그리고 이때, 특정한 코드실행 과정을 묶어서 함수를 생성하는 것을 ‘함수를 정의한다.’고 합니다.

// 함수선언문으로 정의한 함수
function greeting () { 
	console.log('hello world') 
};

변수를 선언하듯 함수 선언 키워드인 function 키워드를 사용하여 함수를 선언하는 방식을 함수선언문, 함수 선언 키워드가 아닌 변수 선언 키워드를 사용하여 함수를 ‘표현’한 방식을 함수표현식이라고 합니다.

함수선언문 호출하는 방법

 function greeting () { 
  console.log('hello world')
};

greeting() // 'hello world'

함수표현문 호출하는 방법

let greeting = function () {
  console.log('hello world')
};

greeting() // 'hello world'

매개변수와 전달인자

매개변수는 함수를 정의할 때 선언하고, 함수 코드 블록 안에서 변수처럼 취급됩니다. 앞서 설명한 것처럼 함수를 정의할 때 소괄호(())에 매개변수를 추가할 수 있습니다. 이렇게 추가된 매개변수는 함수 내부에서 마치 변수와 같은 역할을 하게 됩니다.

function greeting (name) {
	console.log('hello ' + name);
}

greeting('kimcoding'); // 'hello kimcoding'

함수를 호출할 때 소괄호 안에 값을 넣음으로써 매개변수에 값을 할당할 수 있습니다. 이것을 바로 전달인자라고 합니다. 호출할 때 전달한 'kimcoding'이라는 문자열이 함수 내부에서 매개변수 name에 할당된 것을 확인할 수 있습니다. 이처럼 매개변수와 전달인자를 활용하면 함수 외부에서 함수 내부로 값을 전달할 수 있습니다.

return문

'반환한다'라는 의미로 외부에서 전달 받은 값을 외부로 반환하는 것을 의미한다.
return문의 역할
1. 함수 내부의 코드가 차례대로 실행되다가 return문을 만나면 값을 반환한 후 함수는 종료됩니다. 다시 말해 return문 뒤에 나오는 코드는 실행되지 않습니다.
2. return문에 작성된 코드를 실행한 후 결과를 함수 외부로 리턴합니다. 함수 외부에서 함수를 호출하면 함수의 실행결과를 확인할 수 있습니다.
3. 또는 함수 호출의 결과를 변수에 할당하는 것도 가능합니다.
4. 조금만 더 응용해 본다면, 함수의 호출 결과끼리의 연산도 가능합니다.