JavaScript 함수는 특정 작업을 수행하는 코드 블록입니다.
함수는 재사용 가능하고, 입력값을 받아 처리한 후 결과를 반환할 수 있습니다.
아래에서 JavaScript 함수의 기본 개념, 정의 방법, 인수, 반환값, 그리고 고급 개념에 대해 알아봅시다.
함수정의
함수 선언 (Function Declaration)
function 함수이름(매개변수1, 매개변수2) {
// 실행할 코드
return 반환값; // 선택 사항
}
function add(a, b) {
return a + b;
}
함수 표현식 (Function Expression)
const 함수이름 = function(매개변수1, 매개변수2) {
// 실행할 코드
return 반환값; // 선택 사항
};
const add = function(a, b) {
return a + b;
};
화살표 함수 (Arrow Function)
const 함수이름 = (매개변수1, 매개변수2) => {
// 실행할 코드
return 반환값; // 선택 사항
};
const add = (a, b) => a + b;
함수 호출
const result = add(2, 3); // result는 5가 됩니다.
매개변수: 함수 정의에서 사용하는 변수입니다.
인수: 함수를 호출할 때 전달하는 값입니다.
JavaScript 함수는 기본적으로 매개변수를 지정하지 않아도 호출할 수 있으며,
지정된 매개변수 수와 다르게 인수를 전달할 수 있습니다.
전달되지 않은 매개변수는 undefined로 설정됩니다.
반환값
function multiply(a, b) {
return a * b;
}
const result = multiply(4, 5); // result는 20이 됩니다.
함수는 return 문을 사용하여 값을 반환할 수 있습니다. return 문이 없으면 함수는 undefined를 반환합니다.
고급 개념
콜백 함수 (Callback Function)
function doSomething(callback) {
// 작업 수행
callback(); // 콜백 호출
}
doSomething(() => {
console.log("작업이 완료되었습니다!");
});
함수의 인수로 다른 함수를 전달하는 것입니다. 주로 비동기 작업이나 이벤트 처리에서 사용됩니다.
고차 함수 (Higher-Order Function)
function createMultiplier(multiplier) {
return function(x) {
return x * multiplier;
};
}
const double = createMultiplier(2);
console.log(double(5)); // 10
함수를 인수로 받거나 함수를 반환하는 함수를 말합니다.
클로저 (Closure)
function outerFunction() {
let count = 0;
return function innerFunction() {
count++;
return count;
};
}
const counter = outerFunction();
console.log(counter()); // 1
console.log(counter()); // 2
함수가 자신의 외부 스코프에 있는 변수에 접근할 수 있는 기능입니다. 이는 주로 캡슐화와 데이터 은닉에 사용됩니다.
'개발' 카테고리의 다른 글
js 조건문 (0) | 2024.11.05 |
---|---|
js 스코프 및 화살표 함수 (0) | 2024.11.05 |
깊은 복사 얕은 복사 (0) | 2024.11.05 |
JavaScript 소개 (0) | 2024.11.04 |
CSS Animation (0) | 2024.11.01 |
댓글