JavaScript 함수: 코드의 재사용성과 모듈화를 위한 도구
함수: 코드의 재사용성과 모듈화를 위한 도구 🔄🔧
안녕하세요! 이번에는 프로그래밍에서 매우 중요한 개념인 "함수"에 대해 알아보고 활용하는 방법을 살펴보겠습니다. 함수는 코드의 재사용성과 모듈화를 위해 사용되는 도구로, 프로그램을 구성하는 데에 핵심적인 역할을 합니다. 함께 배워볼까요? 🚀
1. 함수표현식과 함수선언문: 함수를 정의하는 방법
JavaScript에서 함수를 정의하는 방법으로는 함수표현식과 함수선언문이 있습니다. 각각의 방법은 함수를 정의하는 구문이나 사용 방법에서 차이가 있습니다.
1-1. 함수표현식
함수표현식은 변수에 함수를 할당하는 형태로 함수를 정의합니다.
<script>
let sayHello = function() {
console.log("안녕하세요!");
};
sayHello();
</script>
위의 코드에서는 함수표현식을 사용하여 sayHello
라는 변수에 함수를 할당하고 있습니다. 함수를 호출하기 위해 변수 이름 뒤에 소괄호를 사용합니다.
1-2. 함수선언문
함수선언문은 특정한 함수 이름으로 함수를 선언하는 형태로 함수를 정의합니다.
<script>
function sayHello() {
console.log("안녕하세요!");
}
sayHello();
</script>
위의 코드에서는 함수선언문을 사용하여 sayHello
라는 함수를 정의하고 있습니다. 함수를 호출하기 위해 함수 이름을 사용합니다.
2. 매개변수와 전달인자: 함수의 입력과 출력
함수를 호출할 때, 함수에 전달되는 값을 매개변수를 통해 받을 수 있습니다. 전달되는 값은 전달인자라고도 부릅니다.
<script>
function greet(name) {
console.log(`안녕하세요, ${name}님!`);
}
greet("홍길동");
</script>
위의 코드에서는 greet
라는 함수를 정의하고 있습니다. 함수의 매개변수로 name
을 선언하고, 전달인자로 "홍길동"을 사용하여 함수를 호출합니다.
3 . Return: 함수의 반환 값
함수는 필요에 따라 결과 값을 반환할 수 있습니다. 이를 위해 return
키워드를 사용합니다.
<script>
function add(a, b) {
return a + b;
}
let result = add(3, 5);
console.log(result);
</script>
위의 코드에서는 add
라는 함수를 정의하고 있습니다. 함수 내부에서 a
와 b
를 더한 결과를 return
하여 반환합니다. 반환된 값은 변수 result
에 저장되고, 이를 출력합니다.
4. 함수를 이용한 구구단 n단 출력
함수를 사용하면 반복되는 작업을 간편하게 처리할 수 있습니다. 아래 예제는 함수를 활용하여 원하는 단의 구구단을 출력하는 코드입니다.
<script>
function printMultiplicationTable(dan) {
for (let i = 1; i <= 9; i++) {
let result = dan * i;
console.log(`${dan} x ${i} = ${result}`);
}
}
printMultiplicationTable(5);
</script>
위의 코드에서는 printMultiplicationTable
이라는 함수를 정의하고 있습니다. 함수의 매개변수로 dan
을 선언하고, 반복문을 통해 구구단을 출력합니다. printMultiplicationTable
함수를 호출하여 원하는 단의 구구단을 출력할 수 있습니다.
5. 함수들의 차이점과 활용
함수표현식과 함수선언문은 사용 방법과 동작 방식에서 차이가 있습니다. 각각의 특징과 용도에 맞게 선택하여 함수를 정의하고 활용하는 것이 중요합니다. 자세한 내용은 아래 링크에서 확인할 수 있습니다.
하단에 따라해보기 실습 예제
아래는 실습으로 직접 코드를 작성해보고 실행해볼 수 있는 예제입니다. 도전해보세요!
<script>
function calculateCircleArea(radius) {
const PI = Math.PI;
return PI * radius * radius;
}
let area = calculateCircleArea(5);
console.log("원의 넓이:", area);
</script>
위의 코드에서는 calculateCircleArea
라는 함수를 정의하고 있습니다. 함수의 매개변수로 radius
를 받아 원의 넓이를 계산하여 반환합니다. 반환된 값을 변수 area
에 저장하고, 이를 출력합니다. 반지름의 값을 변경하면서 원의 넓이를 계산해보세요!
함수를 사용하면 코드의 재사용성을 높이고, 작업을 모듈화하여 효율적인 프로그래밍을 할 수 있습니다. 함수를 활용하여 복잡한 작업을 단순화하고 가독성 높은 코드를 작성해보세요! 😊🔧