나만의 작은 도서관

[JavaScript] 기초 7. 함수(function) 본문

JavaScript/정리

[JavaScript] 기초 7. 함수(function)

pledge24 2024. 4. 23. 18:11
유의사항: 해당 글은 공부한 내용을 정리하는 용도이므로, 수정이 필요할 경우 내용의 수정이 있을 수 있습니다.

함수(function)

함수(function)는 자바스크립트에서 코드를 재사용하고 조직화하기 위해 사용한다. 함수는 특정 작업이나 계산을 수행하는 코드 블록을 나타내며, 이를 호출하여 실행하는 방식으로 동작한다. 함수 내에서 선언한 변수는 외부에서 확인할 수 없다. 단, var는 호이스팅에 의해 전역변수로 취급되므로 예외이다.

 

함수의 3가지 형태

자바스크립트에서 함수를 표현할 수 있는 방식은 총 3가지다(더 있을 수도 있다). 3가지 방식은 생긴 모습은 다르지만 전부 동일한 기능을 가지고 있다. 물론 3번째 방법인 화살표함수는 this와 관련해서 다른 점이 있지만 기본적인 기능을 동일하다.

 

1. 기본형태

// function add(param1, param2, ... paramN){
//     statement1;
//     statement2;
//     statement3;
// }

function add1(x, y){
    return x + y;
}

console.log(add1(2, 3));

// Output:
// 5

 

2. 변수에 저장

let add2 = function (x, y){
    return x + y;
}

console.log(add2(2, 3));

// Output:
// 5

 

3. 화살표 함수

let arrowfunc01 = (x, y) => {
    return x + y;
}

let arrowfunc02 = (x, y) => x + y;	// 내부 코드가 한 줄인 경우 이렇게 적을 수 있다.
let arrowfunc03 = x => x;		// 매개변수마저 하나인 경우 이렇게 적을 수 있다.