TIL11 - 2023.10.05

명령형 프로그래밍

• 컴퓨터가 수행할 명령들을 순서대로 써 놓은 것
• "어떻게 구현하는가(어떤 방법으로 하는가)"를 디테일하게 기술하는 것에 관점이 가있다

 

선언형 프로그래밍

• "무엇을 나타내야 하는가"에 관점이 가있다

 

명령형 프로그래밍 vs 선언형 프로그래밍

예시 1

//명령형
function double(arr) { //array의 값을 어떻게 가공할 것인가
    let results = [];
    for(let i = 0; i < arr.length; i++) {  // 어떻게 처리하는지에 대한 묘사
        if (typeof arr[i] === 'number'){
            results.push(arr[i] * 2);
        }
    }
    return results;
}

//선언형
function double(arr) { // map으로 어떠한 과정을 거칠 것인지
    return arr.filter(element => typeof element === 'number')
              .map(number => number * 2); // 무엇을 원하는지에 대한 묘사
}

예시 2

//명령형
function filterCats(cats) {
    let results = [];

    for(let i = 0; i < cats.length; i++) {
        if(cat &&
            cat.colors.include('black') &&
            cat.ear === 'unfolded') {
                results.push(cat.name);
            }
    }
    return results;
}

//선언형
function filterCats(cats) {
    return cats.filter(cat => cat && 
        cat.colors.includes("black") && 
        cat.ear === 'unfolded'
        ).map(cat => cat.name)
}

이외에도 기능을 구현하다보면 명령형 같은 경우 요구사항이 많아질 수록 코드가 복잡해져 해당 코드가 무슨 일을 하는지 바로 파악할 수 없다. 예를 들어 토글 버튼과 관련한 기능 추가를 구현할 때, 명령형 프로그래밍은 돔을 많이 접근하게 되는데 그러면 많이 복잡해지고 후에 확장하기도 좋지 않다. 하지만 선언형 프로그래밍은 상태로 추상화를 하고 상태를 기반으로 접근을 하도록 작성할 수 있어 복잡도를 많이 낮추고, 이후에 확장하는데에 있어서도 좋다. 때문에 UI를 다루는 것에 있어서 선언형 프로그래밍으로 구현하는 것이 더 좋다