[JavaScript] 화살표 함수로 반복문 단순하게 만들기

화살표 함수란 무엇일까?

---

화살표 함수는 함수가 장황해지는 문제를 해결해 간결하고 짧게 작성할 수 있도록 도와준다.
불필요한 정보들을 최대한 제거해 작성할 수 있으며, function 키워드, 인수를 감싸는 괄호, return 키워드, 중괄호 등을 줄일 수 있다.

 

 

기명 함수를 화살표 함수로 바꾸기

---

아래는 기명 함수로 작성된 예제다:

function capitalize(name) {
    return name[0].toUpperCase() + name.slice(1);
}

 

이 함수를 익명 함수로 작성하면 다음과 같이 변환할 수 있다:

const capitalize = function(name) {
    return name[0].toUpperCase() + name.slice(1);
};

 

익명 함수에서 function 키워드를 제거하고 화살표를 사용하면, 더 간결한 코드가 된다:

const capitalize = (name) => {
    return name[0].toUpperCase() + name.slice(1);
};

 

여기서 return과 중괄호도 생략하면 최종적으로 이렇게 작성할 수 있다:

const capitalize = name => name[0].toUpperCase() + name.slice(1);

 

 

익명 함수를 화살표 함수로 바꾸기

---

아래는 익명 함수를 사용한 예제다:

applyCustomGreeting('mark', function(name) {
    return `안녕, ${name}`;
});

 

 

위 코드를 화살표 함수로 변환하면 이렇게 된다:

applyCustomGreeting('mark', name => `안녕, ${name}`);

 

화살표 함수는 단순히 코드를 줄이는 것 이상으로, 배열 메서드와 결합하면 더욱 강력한 도구가 된다. 다음 포스팅에서는 배열 메서드와 화살표 함수를 사용해 컬렉션을 편리하게 갱신하는 방법을 알아볼 예정이다.