함수란?

미마모코딩·2022년 4월 10일
0
post-thumbnail

함수는 자바스크립트에서 가장 중요한 핵심 개념이다.

따라서 함수는 자바스크립트를 정확하게 이해하고 사용하기 위해 피해갈 수 없는

핵심 개념이기에 천천히 이해해보자.

프로그래밍 언어의 함수는 일련의 과정을 문 으로 구현하고 코드 블록으로

감싸 하나의 실행 단위로 정의한 것이다.

함수의 개념에선 함수의 이름 , 매개변수 , 반환값 , 인수 라는 개념이 존재한다.

코드로 예를 들어보자.

<script>
function add(x,y){
  return x + y;
}
add(2,5);
</script>

1.위 코드에서 function add 라는 함수를 정의했다 . 이 함수의 이름은 add이다.

-함수의 정의과정

2.또한 function add(x,y)의 x,y는 사용자에게 값을 받아 x,y 의 자리에 값을 이동시킨다.

-이과정이 매개변수 자리에 인수를 넣는다고 표현한다.

3.return x + y 에선 우리가 사용자에게 값을 받아온 x ,y를 더하는 연산을 진행한다.

-반환값을 나타내는 과정이다

4.정의한 함수를 호출시킬땐 함수이름 () 의 문법을 사용한다 . add() 이렇게 말이다.

-이 과정을 함수의 호출이라고 말한다

  1. add(2,5) add라고 정의한 함수에 2,5를 넣어서 실행하겠다 .

-함수를 호출하며 인수 자리에 2,5를 넣은것이다.

이렇게 함수에는 함수의 정의 , 매개변수 , 반환값 , 인수 함수의 호출이 있다.

또한 위 코드에서 return을 사용해 값을 반환받고 그 값을 다른 변수에 할당도 가능하다.

<script>
 var result = add(2,5);
 //함수 add에 인수 2,5를 전달하면서 호출하면 반환값 7을 반환한다.
 console.log(result); // 7
</script>

이렇게 함수를 사용하면 어떤 장점들이 있을까?

필요할 때 여러 번 호출할 수 있기에 재사용이 가능하다.

특정한 기능을 구현한 함수를 사용하면 반복적인 작업들이 줄어들고 효율성이 극대화된다.

작은 함수 단위로 쪼개서 프로그래밍을 하게되면 유지보수가 편리하고 가독성이 좋다.

함수 리터럴 구성요소

함수 리터럴의 구성 요소는 다음과 같다.

함수이름 , 매개변수 목록 , 함수 몸체

함수이름

함수의 이름은 식별자이기 때문에 식별자 네이밍 규칙을 준수한다.

또한 함수이름은 생략할 수 있다. 이름이 있는 함수를 기명함수 , 이름이 없는 함수를 무명/익명 함수라고 한다.

매개변수 목록

0개 이상의 매개변수를 소괄호로 감싸고 쉼표로 구분한다.

각 매개변수에는 함수를 호출할 때 지정한 인수가 순서대로 할당된다.

즉 매개변수 목록은 순서에 의미가 있다.

매개변수는 함수 몸체 내에서 변수와 동일하게 취급된다.

따라서 매개변수도 변수와 같이 식별자 네이밍 규칙을 준수해야한다.

함수몸체

함수가 호출 될 때 일괄적으로 실행될 문들을 하나의 실행 단위로 정의한 코드 블록이다.

함수 몸체는 함수 호출의 의해 실행된다.

코드로 예를 들어보자.

<script>
function add << 함수이름 (x,y) << 매개변수 {  //여기부터
  return x + y;    
//여기까지 함수바디}   
add(2,5) << //2, 5 인수;
</script>

이런 구조로 만들어지기 때문에 함수란 개념이랑 조금 더 친해지길 바란다.

함수의 변수 할당

자바스크립트에서 함수는 객체 타입의 값이다.

자바스크립트의 함수는 값처럼 변수에 할당 할 수 있고

프로퍼티 값이 될 수 있으며 배열의 요소가 될 수도 있다.

이처럼 값의 성질을 갖는 객체를 일급 객체라 한다.

자바스크립트의 함수는 일급 객체이다.

함수가 일급 객체라는 것은 함수를 값처럼 자유롭게 사용할 수 있다는 의미다.

코드로 예를 들어보자.

<script>
var add = function foo (x,y){
 return x + y;
}
//함수 객체를 가리키는 식별자로 호출
console.log(add(2,5)); // 7

//함수 이름으로 호출하면 ReferenceError:  발생
//함수 이름은 함수 몸체 내부에서만 유효한 식별자다.
console.log(foo(2,5)); // ReferenceError: foo is not defined
</script>

이렇듯 함수를 변수에 할당한 상황에서는 함수이름을 통해 호출하면

몸체 내부에서만 유효한 식별자이기 때문에 정의되지 않았다고 오류가 발생한다.

그렇기 때문에 함수를 변수에 할당할땐 익명함수로 만들어서 변수의 이름이

함수의 기능을 나타내는 명시적인 이름을 사용해 재사용성을 높인다.

다음 업로드 내용은 함수의 호이스팅이다.

무척 중요한 내용이니 같이 공부하면서 차근차근 알아가보자.

0개의 댓글