2026년 상식닷컴 선정 식당 & 카페 리스트
최근에 오픈한 호텔을 찾는다면 살펴보세요

함수 표현식과 함수 선언의 차이는 무엇인가요?

_____
Q1: 함수 선언(Function Declaration)이란 무엇인가요?
A1: 함수 선언은 자바스크립트에서 `function` 키워드를 사용하여 함수 이름과 본문을 정의하는 구문입니다. 예를 들어:
```javascript
function add(a, b) {
return a + b;
}
```
함수 선언은 호이스팅(hoisting)의 영향을 받아, 코드의 어디서든 함수를 호출할 수 있습니다.

---

Q2: 함수 표현식(Function Expression)이란 무엇인가요?
A2: 함수 표현식은 함수 객체를 변수에 할당하는 구문입니다. 익명 함수나 기명 함수를 변수에 할당할 수 있습니다. 예를 들어:
```javascript
const add = function(a, b) {
return a + b;
};
```
변수 `add`에 함수가 할당되어 나중에 호출할 수 있습니다.

---

Q3: 함수 선언과 함수 표현식의 가장 큰 차이점은 무엇인가요?
A3: 가장 큰 차이는 호이스팅 동작 입니다.
- 함수 선언은 코드 실행 전에 호이스팅되어, 함수 선언 이전에도 함수 호출 가능
- 함수 표현식은 변수에 함수가 할당되는 시점에 인식되어, 선언 이후에만 호출 가능

---

Q4: 호이스팅이란 무엇인가요?
A4: 호이스팅은 자바스크립트 엔진이 함수 선언 및 변수 선언을 코드 실행 전에 메모리 상단으로 끌어올리는 동작입니다. 함수 선언은 본문 전체가 호이스팅되지만, 함수 표현식은 변수 선언만 호이스팅되고, 할당은 되지 않습니다.

---

Q5: 함수 선언과 함수 표현식의 문법적 차이는 무엇인가요?
A5:
- 함수 선언: `function 함수이름() { ... }` 형태로 코드 블록 내 가장 첫 줄에 사용 가능
- 함수 표현식: 변수에 익명 함수 또는 기명 함수를 할당하는 형태, 보통 다른 표현식 내에서도 사용 가능

---

Q6: 함수 표현식은 익명 함수만 사용할 수 있나요?
A6: 아닙니다. 함수 표현식은 익명 함수 또는 이름이 있는 함수 모두 사용할 수 있습니다. 이름을 지정하면 디버깅 시 유용합니다.
예:
```javascript
const factorial = function fact(n) {
if (n <= 1) return 1;
return n * fact(n - 1);
};
```

---

Q7: 함수 선언과 함수 표현식 중 어떤 것을 사용하는 것이 좋나요?
A7: 상황에 따라 다르지만 대체로:
- 함수 선언은 명확한 함수 정의가 필요할 때, 코드 구조가 깔끔할 때
- 함수 표현식은 익명 함수를 변수에 할당하거나 콜백 함수 작성 시 많이 사용됨
또한, 모듈화 및 클로저 사용에 함수 표현식이 유용할 수 있습니다.

---

Q8: 함수 표현식은 즉시 실행 함수(IIFE)에도 사용되나요?
A8: 네, 함수 표현식은 즉시 실행 함수(IIFE; Immediately Invoked Function Expression)를 만들 때 주로 사용됩니다. 예:
```javascript
(function() {
console.log('즉시 실행!');
})();
```

---

요약:
- 함수 선언은 `function name() {}` 형태이며 호이스팅으로 인해 선언 이전 호출 가능
- 함수 표현식은 변수에 할당된 함수로, 선언 이후에만 호출 가능하며 익명 또는 기명 함수 모두 가능
- 호이스팅과 코드 구조, 사용 목적에 따라 적합한 방식을 선택하면 됩니다.
함수 표현식함수 선언자바스크립트에서 함수를 정의하는 두 가지 방법입니다.

이 두 가지 방법은 비슷한 목적을 가지고 있지만, 몇 가지 중요한 차이점이 있습니다.

아래에서 이 두 가지 방법의 차이를 자세히 설명하겠습니다.

1. 정의 방법 - 함수 선언 (Function Declaration) : 함수 선언은 `function` 키워드를 사용하여 함수를 정의하는 전통적인 방법입니다.

함수 선언은 다음과 같은 형식으로 작성됩니다.

```javascript function myFunction() { // 함수 내용 } ``` - 함수 표현식 (Function Expression) : 함수 표현식은 함수를 변수에 할당하는 방식으로 정의됩니다.

함수 표현식은 다음과 같은 형식으로 작성됩니다.

```javascript const myFunction = function() { // 함수 내용 }; ``` 또는 화살표 함수를 사용할 수도 있습니다: ```javascript const myFunction = () => { // 함수 내용 }; ```

2. 호이스팅 (Hoisting) 호이스팅은 자바스크립트에서 변수와 함수 선언이 코드의 최상단으로 끌어올려지는 현상을 의미합니다.

함수 선언과 함수 표현식은 호이스팅에서 다르게 동작합니다.

- 함수 선언 : 함수 선언은 호이스팅이 적용되어, 함수가 정의되기 전에 호출할 수 있습니다.

예를 들어: ```javascript console.log(myFunction()); // "Hello, World!" function myFunction() { return "Hello, World!"; } ``` - 함수 표현식 : 함수 표현식은 변수에 할당되기 전에는 호출할 수 없습니다.

따라서 아래와 같은 코드는 오류를 발생시킵니다.

```javascript console.log(myFunction()); // TypeError: myFunction is not a function const myFunction = function() { return "Hello, World!"; }; ```

3. 스코프 (Scope) 함수 선언과 함수 표현식은 스코프에 대한 접근 방식에서 차이가 없습니다.

두 방법 모두 자신만의 스코프를 가지며, 이 스코프 내에서 정의된 변수에 접근할 수 있습니다.



4. 이름 (Name) - 함수 선언 : 함수 선언은 항상 이름을 가집니다.

이 이름은 함수 내부에서 재귀적으로 호출할 때 사용될 수 있습니다.

- 함수 표현식 : 함수 표현식은 이름이 선택적입니다.

이름이 없는 경우 "익명 함수"라고 하며, 이 경우 함수 내부에서 자신을 호출할 수 없습니다.

그러나 이름이 있는 경우에는 재귀 호출이 가능합니다.

```javascript const myFunction = function namedFunction() { return namedFunction(); // 재귀 호출 가능 }; ```

5. 사용 용도 - 함수 선언 : 주로 전역 범위에서 사용할 함수나, 코드의 가독성을 높이기 위해 사용됩니다.

선언된 함수는 코드의 어느 곳에서든 호출할 수 있습니다.

- 함수 표현식 : 주로 콜백 함수나 일회성 함수, 클로저를 만들 때 사용됩니다.

또한, 변수에 할당하여 동적으로 함수를 생성할 수 있는 유연성을 제공합니다.

결론 함수 선언과 함수 표현식은 자바스크립트에서 함수를 정의하는 두 가지 방법으로, 각각의 장단점이 있습니다.

함수 선언은 호이스팅 덕분에 코드의 어느 위치에서든 호출할 수 있는 반면, 함수 표현식은 더 유연하고 동적인 함수 정의를 가능하게 합니다.

개발자는 상황에 따라 적절한 방법을 선택하여 사용할 수 있습니다.

작성자: 정하은 [비회원] | 작성일자: 1년 전 2024-09-10 08:36:55
조회수: 212 | 댓글: 0 | 좋아요: 0 | 싫어요: 0
내용이 부정확하다면 싫어요를 클릭해주세요.