Javascript Function 선언 및 호출

⏰ 2024.11.18 (D+28)

1. 함수 선언 (Function Declaration)

✅ 형식

function 함수이름(매개변수1, 매개변수2, ...) {
    // 함수 본문
    // 함수가 실행할 코드
    return 반환값; // (선택적) 함수가 결과를 반환할 경우
}

📖 예시

function add(a, b) {
    return a + b;
}
let result = add(5, 3);  // 5 + 3을 호출
console.log(result);  // 8 출력

2. 함수 표현식 (Function Expression)

✅ 형식

let 함수이름 = function(매개변수1, 매개변수2, ...) {
    // 함수 본문
    return 반환값;
};

📖 예시

let multiply = function(a, b) {
    return a * b;
};
let result = multiply(4, 3);  // 4 * 3을 호출
console.log(result);  // 12 출력

3. 즉시 실행 함수(IIFE)

📌 1. 정의 ]

• 즉시 실행 함수 (IIFE)란 함수를 정의하자마자 바로 실행되는 함수입니다.
• 주로 일회성 코드 실행이나 전역 변수 오염 방지를 위해 사용됩니다.

2. 작성 형식 방법 및 예시

✅ 형식

(function() {
    // 함수 내용
})();

1. 함수 정의: 함수 표현식을 괄호로 감싼다. 바로 실행할 준비
2. 즉시 실행: 함수 정의 후, 바로 괄호를 하나 더 써서 실행 ()를 통해 함수를 즉시 실행

📖 예시

(function() {
    console.log("즉시 실행 함수!");
})();
// 결과: "즉시 실행 함수!"가 콘솔에 바로 출력됩니다. 이 함수는 정의되자마자 실행됩니다.

3. 매개변수가 있는 즉시 실행 함수

(function(a, b) {
    console.log(a + b);
})(10, 20);
// 결과: 30이 출력됩니다. 함수에 매개변수 a와 b로 10과 20을 전달하고 그 합을 출력합니다.

💡즉시 실행 함수의 특징
1. 즉시 실행: 함수가 정의되자마자 바로 실행됩니다.
2. 지역 변수 보호: 함수 내부에서 선언한 변수는 외부에서 접근할 수 없습니다.

예시 3: 지역 변수 보호
(function() {
    var x = 10;
    console.log(x); // 10 출력
})();

console.log(x); // ReferenceError: x is not defined
// 결과: x는 함수 내부에서만 유효하고, 함수 밖에서는 x를 사용할 수 없습니다.

사용하는 이유❓
1. 일회성 코드: 한 번만 실행되는 코드 블록을 작성할 때 사용합니다.
2. 전역 변수 보호: 코드에서 전역 변수를 오염시키지 않도록 내부에서만 변수를 사용할 수 있게 합니다.

IIFE는 이렇게 정의된 함수가 즉시 실행되고, 그 안에서만 변수를 사용할 수 있게 해주는 중요한 기능을 제공

4. 화살표 함수 (Arrow Function)

✅ 형식

let 함수이름 = (매개변수1, 매개변수2, ...) => {
    // 함수 본문
    return 반환값;
};

📖 예시

let divide = (a, b) => a / b;
let result = divide(10, 2);  // 10 / 2를 호출
console.log(result);  // 5 출력

5. 함수 호출 (Function Invocation)

✅ 형식

함수이름(인자1, 인자2, ...);

📖 예시

function greet(name) {
    console.log("Hello, " + name + "!");
}
greet("Alice");  // "Hello, Alice!" 출력
greet("Bob");    // "Hello, Bob!" 출력

6. 익명 함수와 함수 호출 (Anonymous Functions and Invocation)

✅ 형식

(function() {
    // 즉시 실행할 코드
})();

📖 예시(즉시 실행 함수 표현식, IIFE)

(function() {
    console.log("This is an Immediately Invoked Function Expression!");
})();