JS 함수

함수 (Function)

함수는 어떤 작업을 하거나 계산을 하기 위한 절차를 정의해 놓은 명령어 입니다. 예를들어 '바나나 만들기' 를 모르는 로봇에게 바나나를 만들라고 하면 아무 일도 못하지만 '바나나 만들기'는 '땅을 파서 바나나씨를 심고 물을 주는것'이 라고 미리 알려주고 '바나나 만들기' 명령을 내리면 로봇은 작업을 수행할 수 있습니다. 이렇게 복잡한 명령을 '바나나 만들기' 처럼 간단하게 정의 내려 놓은 것을 함수라고 합니다.

땅을 파서 바나나씨를 심고 물을 준다 => 바나나 만들기

함수사용

인터넷 브라우저는  '화면에 가로 400px, 높이 200px 크기의 창을 만들고 확인 버튼을 누르면 창이 없어지게 하기' 라는 명령을 'alert' 라는 함수로 정의해 놓았습니다. 함수를 사용(호출)하는 방법은 함수명 뒤에 () 괄호를 붙여 사용합니다. 콘솔창에 'alert()' 라고 입력하면 경고창이 뜨는 것을 확인할 수 있습니다. ()괄호 안에 내용을 넣으면 경고창에 해당 내용을 표시할 수도 있습니다. 'alert('안녕하세요')'

함수선언()

함수를 만드는(선언하는) 방법은 'function' 이라고 표시하고 함수이름을 작명한후 { } 대괄호 사이에 실행할 명령을 나열하면 새로운 함수가 만들어 집니다. 

function 바나나만들기(a){ console.log('바나나 씨를 심고 물을 주어라') }

함수선언(매개변수)

위의 함수는 바나나만을 만들 수 있는 명령문 이지만 함수를 선언할때 ()괄호안에 어떤 요소(매개변수)를 넣고 그 값에 따라 다른 명령이 실행 될 수 있도록 선언하면 ()괄호안에 들어간 값(인자)에 따라 다양한 명령을 수행하도록 할 수 있습니다.

function 과일만들기(a){ console.log('땅을파서' + a + '씨를 심고 물을 주어라') }

함수선언 축약

함수는 변수 의 값으로도 사용할 수 있는데 이때에는 함수를 선언할 때 function 을 생략하고 화살표로 간단히 축약해서 표시할 수 있습니다. 

function 함수이름(){ 내용 }   =  const 함수이름 = ()=>{ 내용 }

 

괄호안에 매개변수가 하나만 있다면 () 괄호를 생략할 수도 있습니다. return 값이 있거나 코드가 한줄이면 { } 대괄호도 생략 가능합니다.

함수 return 명령

함수안에서 'return' 을 사용하면 함수 실행을 중간에 종료하거나 특정한 값을 반환할 수 있습니다. 

• 함수종료

아래의 '바나나먹기' 함수는 매개변수 a에 3이하 숫자를 넣으면 함수가 실행되지 않고 2이상인 숫자를 넣어야 실행됩니다.

• 값 반환

return 뒤에 특정한 값을 넣으면 함수를 종료하는 기능과 더불어 어떠한 값을 반환할 수 있게 해줍니다.