6. JavaScript Function(함수)

1. Function(함수)

Function에 대해서 알아봅시다.

 

함수란? 하나의 특정한 작업을 수행하도록 설계된 독립적인 블록입니다.

 

변수에 이름이 있듯이, 함수도 이름이 있습니다.

 

함수 이름을 부르면, 함수 내에 있는 코드가 실행됩니다.

 

함수를 불러 실행시키는 것을 앞으로 "함수를 호출한다" 라고 표현하겠습니다.

 

아래 코드를 봐주세요.

function checkCorrect() {

  let hi = "안녕하세요";

  return hi;

}

함수가 정의되어 있습니다. 이름은 checkCorrect네요.

 

위와 같이 함수를 생성하고,

 

아래와 같이 이름을 불러 호출할 수 있습니다.

checkCorrect();

함수를 호출해주니 함수 내에 있는 코드가 실행되었습니다. 

 

함수를 사용하는 방법은 다음과 같습니다. 

• function 키워드로 시작하여
• 함수 이름을 지어주고
• 함수를 알리는 소괄호((): parentheses)를 열고 닫고
• 함수의 시작을 알리는 중괄호({: curly bracket)을 열어줍니다.
• 실행할 코드를 중괄호와 중괄호 사이에 작성합니다. 함수의 body라고 부르기도 합니다. 이 부분에 들여쓰기가 되어있습니다. 함수 내부에 있는 코드라는 것을 알기 좋게 하려고 들여쓰기 하였습니다.
• return(반환) 할 것이 있다면 작성합니다.
• 중괄호(}: curly bracket)로 닫아줍니다. 함수의 작성이 끝났음을 알립니다.

위 방법은 함수를 정의 하는 방법입니다. 

 

함수를 정의해주는 것만으로는 함수를 사용할 수 없습니다!

 

위 사진에서 봤듯이 호출을 해줘야합니다.

 

호출 방법은 간단합니다.

• 함수 이름을 적은후 끝에 소괄호((): parentheses)를 열고 닫고 마지막에 ;(semicolon)을 붙이면 됩니다!

굉장히 쉽죠 ? 

 

앞으로 엄청나게 많은 함수를 만들고 사용할 예정이니.. 꼭 정의 방법과 호출 방법을 외우셔야 합니다!

2. 데이터 반환하기

위 사진에서 이미 'return' 이라는 키워드를 사용했습니다.

 

하지만 아직은 함수의 반환, return 이라는 개념이 명확히 들어오진 않으셨을 겁니다.

 

return이라는 개념에 대해 살펴보겠습니다.

 

함수의 반환(return)

 

모든 함수는 반환(return)을 합니다.

 

함수는 항상 데이터를 반환하기 때문에 그 결과를 변수에 저장할 수도 있고,

 

다른 로직에 다시 사용할 수도 있습니다.

 

함수의 반환 값을 확인하는 법을 다시 한 번 볼까요?

 

아래와 같이 함수를 호출해서, 변수에 저장하고

 

그 변수를 console.log()로 확인하면 됩니다. 간단하죠

1번 방법
let result = checkCorrect();
console.log(result);

2번 방법
console.log(checkCorrect());

 

두 방법중 하나를 사용하시면 됩니다. 

 

모든 함수가 return을 포함해야 되는것은 아니지만 함수가 반환을 생략할시 undifined라는 값을 반환합니다.

3. 매개변수(parameter)와 인자(argument)

위에서는 return 키워드를 통해 함수를 호출할 때 데이터를 "반환"하는 법을 배웠습니다.

 

이제는 함수가 "외부에서 입력 받은 데이터를 처리하는 경우"에 대해 배워보겠습다.

 

함수는 어떻게 외부의 값을 받을까요?

function getName(name) {
  return name + '님';
}

정의된 함수의 소괄호 내부에 지금까지와는 달리 'name'이라는 단어가 들어 있습니다.

 

이처럼 함수 이름 옆 소괄호 자리에 적혀 있는 단어는 매개변수, parameter라고 부릅니다.

 

외부로부터 들어오는 값을 담아 함수 내부에서 사용하도록 하는 변수의 역할을 합니다.

 

함수를 한번 호출해 볼까요 ?

getName('개발자');

getName함수의 ()안에 '개발자'가 함수의 변수에 직접 전달되었습니다. 

 

'개발자'와 같은 실질적인 값을 argument(인자)라고 합니다.