함수를 정의합시다!

왜 함수를 정의합니까

같은 뜻을 가진 논리에 이름을 붙여 쉽게 식별할 수 있다

같은 일을 하고 싶은 곳에서 똑같은 행동을 할 수 있음

함수 예제 없음

function showExcel(user) {
    downloadExcel(`${user.firstName} ${user.lastName}`)
}

function showHtml(user) {
    renderHtml(`${user.firstName} ${user.lastName}`)
}

사용자가 표시하는 규격은 공백 연결로 성/이름을 표시하는 것이다.

규격이 변경되면 showExcel/showHtml 두 가지 모두 필요합니다.

Html의 변경이 누락되었습니다><발생할 수 있죠!

이것은 함수를 정의해서 피할 수 있다

함수를 정의해 봅시다

function showUser(user) {
    return `${user.firstName} ${user.lastName}`
}

function showExcel(user) {
    downloadExcel(showUser(user))
}

function showHtml(user) {
    renderHtml(showUser(user))
}

ShowUser에 묘자/이름을 공백 연결로 표시하는 방법을 만족시키는 논리를 적었습니다!

사용자가 표시하는 규격에 변화가 생겨 묘자만 좋아졌을 때 ShowUser를 변경하면 됩니다!한 군데만 변경하면 돼!

같은 규격은 프로그램으로 같은 논리에서 호출할 수 있습니다!

무명 함수를 함부로 쓰지 말고 함수에 이름을 붙여 정의해라

이걸 읽으면 s e l e ctActive AdminUsers By Group이 뭘 할지 알 수 있을까요?

Filter에 전달된 무명 함수 중 무엇을 하고 있을까...그렇게 생각하면 시간이 걸려요.

function selectActiveAdminUsersByGroup(users, group) {
    return users
        .filter(user => user.status === Active)
        .filter(user => user.groupId === group.id)
        .filter(user => user.role === God || user.role === Admin)
}

함수로 나누어 정의해 보자

이렇게 하면 Filter에 건네준 함수명부터 무엇을 하는지 논리

까지 쉽게 알 수 있다

isActiveUser/isUserInGroup/isAdminUser는 s e ctActiveAdminUsersByGroup 이외의 함수에서도 앞으로도 사용할 수 있어 매우 편리합니다!

function isActiveUser(user) {
    return user.status === Active
}
function isUserInGroup(user, group) {
    return user.groupId === group.id
}

function isAdminUser(user) {
    return user.role === God || user.role === Admin
}

function selectActiveAdminUsersByGroup(users, group) {
    return users
        .filter(isActive)
        .filter(user => isUserInGroup(user, group))
        .filter(isAdminUser)
}