Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
Tags
- html
- 비동기프로그래밍
- flutter 오류
- 퍼포먼스 최적화
- React
- 웹 성능
- 컴포넌트
- #프론트엔드개발
- 자바스크립트
- 웹 개발
- 코드리뷰
- JavaScript
- flutter android sdk
- 프라미스체이닝
- 패키지 스크립트
- aondroid toolchain 오류
- jsx
- macos flutter
- 프론트엔드
- css
- fe
- 자바스크립트공부
- 웹개발
- 웹 성능 최적화
- cmdline-tools missing
- dom
- 풀스택 개발
- 국제화(i18n)
- Promise
- Node.js
Archives
- Today
- Total
sodol-dotcom
함수 전달 방식에 대한 이해: 함수 선언 vs. 기명 함수 표현식 본문
1. 첫 번째 방식: 함수 선언
function sub() {
console.log("i am sub");
}
main(sub);
- 함수 선언을 사용해
sub
라는 이름의 함수를 먼저 정의한 후, 이 함수를main
함수에 전달한다. - 이렇게 하면
sub
함수는 코드의 다른 부분에서도 사용할 수 있다. 즉,sub
라는 이름을 가진 함수가 어디에서든 접근 가능하다. - 가독성이 좋고 , 여러 곳에서
sub
함수를 재사용할 수 있다.
2. 두 번째 방식: 기명 함수 표현식
main(function sub() {
console.log("i am sub");
}
- 기명 함수 표현식을 사용하여 함수를 직접
main
함수에 전달한다. 여기서 함수는 이름을 가지고 있지만, 오직main
함수에서만 사용된다. - 이 방식은 함수가 오직
main
에서만 사용되며 다른 곳에서 접근할 필요가 없다는 것을 명확히 한다. - 전역 네임스페이스를 오염시키지 않고, 해당 함수가 한 곳에서만 쓰인다는 것을 분명히 할 수 있다.
3. 왜 두번째 방식을 권장할까?
- 스코프의 한정성: 함수가 특정 작업에만 쓰이므로, 다른 부분에서 사용할 필요가 없다면, 그 위치에서 바로 정의하는 것이 좋다.
- 스코프의 명확성: 위와 비슷하게 기명 함수 표현식은 정의된 위치에서만 사용할 수 있으므로 함수의 사용 범위를 제한하고, 코드의 의도를 명확히 할 수 있다.
- 전역 오염 방지: 필요 없는 전역 함수 순언을 피할 수 있어 코드가 깔끔해진다.
- 호이스팅 방지: 기명 함수 표현식은 선언과 동시에 함수가 정의되며, 코드에서 해당 함수가 사용될 때까지 함수가 정의되지 않는다. 따라서 호이스팅과 관련된 혼란을 피할 수 있다.
- 코드의 가독성: 코드가 함수의 정의와 사용 위치가 가까워져 가독성이 좋아질 수 있다. 함수가 다른 곳에서 사용되지 않거나, 특정 함수가 특정 작업에만 쓰일 때 이 방식이 유용하다.
4. 결론
함수가 특정 작업에서만 필요하고 다른 곳에서 재사용하지 않을 경우, 두 번째 방법이 더 적합하다. 이렇게하면 코드의 의도를 명확히 하고, 코드의 관리가 쉬워진다.
‘기명 함수 표현식’이라는 이름이 어려워서 남기는 메모
- 간단한 용어로 설명하기
- 함수 표현식: 함수 정의를 변수에 할당하는 방식으로, 이름이 있는 함수 정의
- 이름 붙은 함수: 함수 정의에 이름을 붙여서 사용하는 방법
- 비교를 통한 이해
- 함수 선언:
function myFunction() { /* code */ }
(전역 또는 상위 스코프에서 사용 가능) - 이름 붙은 함수 표현식:
main(function myFunctinon() { /* code */ });
(특정 작업에만 사용됨)
- 함수 선언:
- 코스 예시로 이해하기
- 함수 선언:
main(functio greet() { console.log("Hello!"); }); // main 함수 내에서만 사용 가능
- 이름 붙은 함수 표현식:
function greet() { console.log("Hello!"); } greet(); // 어디에서든 사용 가능
- 함수 선언:
'Fundamentals > JavaScript' 카테고리의 다른 글
함수 스코프, 지역 스코프, 블록 스코프 (0) | 2024.09.12 |
---|---|
함수 선언문의 스코프 (0) | 2024.09.12 |
자바스크립트 호이스팅 (0) | 2024.09.09 |
함수 선언식과 함수 표현식 (0) | 2024.09.09 |
함수의 반환과 할당: return 문이 없을 때 undefined가 반환되는 이유 (0) | 2024.09.09 |