객체 지향과 함수형 프로그래밍

우리는 지금까지 자바스크립트 기본 문법과 동작 원리, 객체/프로토타입 기반 데이터 관리 방법을 학습했습니다.

이제는 코드를 어떤 방식으로 조직하고 설계할지로 시야를 확장해야 하며, 이것이 프로그래밍 패러다임(Programming Paradigm)입니다.

프로그래밍 패러다임은 프로그래머가 프로그램을 작성할 때 따르는 일련의 사고방식이나 원칙을 의미합니다.

이는 문제 해결 방식과 코드 구조에 큰 영향을 미치며, 어떤 패러다임을 선택하느냐에 따라 코드의 가독성, 유지보수성, 확장성 등이 달라질 수 있습니다.

자바스크립트는 매우 유연한 언어여서 단일한 패러다임에 얽매이지 않고, 여러 패러다임의 특징을 수용할 수 있습니다.

특히 현대 자바스크립트 개발에서는 객체 지향 프로그래밍(Object-Oriented Programming, OOP)과 함수형 프로그래밍(Functional Programming, FP)이라는 두 가지 주요 패러다임의 특징이 널리 사용됩니다.

이번 장에서는 두 핵심 패러다임의 기본 개념과 자바스크립트 적용 방식을 정리합니다.

객체 지향 프로그래밍

앞 절의 class·클로저와 5장의 객체 참조·얕은 복사를 사용할 수 있으면 예시를 따라갈 수 있습니다. 이 절에서는 같은 잔액 변경을 두 방식으로 비교합니다. 어떤 이름의 패러다임인지보다 이전 잔액을 보존해야 하는지, 변경 규칙을 누가 검사하는지에 주목하세요.

객체 지향 프로그래밍(OOP)은 실제 세계의 개체(객체)를 모델링하여 프로그램을 설계하는 패러다임입니다.

데이터(속성)와 데이터를 처리하는 기능(메서드)을 하나의 객체 안에 캡슐화하고, 이 객체들 간의 상호작용을 통해 프로그램을 구성합니다.

OOP의 핵심 원칙은 다음과 같습니다.

// class를 이용한 캡슐화 예시
class Account {
    #balance; // ES2022 private class fields (최신 문법)

    constructor(initialBalance) {
        if (initialBalance < 0) {
            throw new Error("초기 잔액은 0 이상이어야 합니다.");
        }
        this.#balance = initialBalance;
    }

    deposit(amount) {
        if (amount > 0) {
            this.#balance += amount;
            console.log(`입금: ${amount}, 현재 잔액: ${this.#balance}`);
        }
    }

    withdraw(amount) {
        if (amount > 0 && this.#balance >= amount) {
            this.#balance -= amount;
            console.log(`출금: ${amount}, 현재 잔액: ${this.#balance}`);
        } else {
            console.log("잔액 부족 또는 유효하지 않은 금액.");
        }
    }

    getBalance() {
        return this.#balance;
    }
}

const myAccount = new Account(10000);
myAccount.deposit(5000);
myAccount.withdraw(2000);
console.log(myAccount.getBalance());
// console.log(myAccount.#balance); // 직접 접근 불가 (SyntaxError)

// 상속 예시 (이전 3장에서 다룬 class 상속)
class Vehicle {
    constructor(brand) {
        this.brand = brand;
    }
    start() {
        console.log(`${this.brand} 시동을 겁니다.`);
    }
}

class Car extends Vehicle {
    constructor(brand, model) {
        super(brand);
        this.model = model;
    }
    drive() {
        console.log(`${this.brand} ${this.model}가 운전 중입니다.`);
    }
}

const myCar = new Car("현대", "쏘나타");
myCar.start(); // 부모 클래스의 메서드 사용
myCar.drive(); // 자식 클래스의 메서드 사용

class Animal {
    sound() {
        console.log("동물 소리!");
    }
}

class Cat extends Animal {
    sound() { // 부모의 sound 메서드를 재정의 (오버라이딩)
        console.log("야옹!");
    }
}

class Dog extends Animal {
    sound() { // 부모의 sound 메서드를 재정의 (오버라이딩)
        console.log("멍멍!");
    }
}

const animals = [new Animal(), new Cat(), new Dog()];

animals.forEach(animal => animal.sound());
/*
결과:
동물 소리!
야옹!
멍멍!
*/
// 동일한 sound() 메서드를 호출했지만, 객체 타입에 따라 다른 동작을 보입니다.

• 재사용성: 클래스와 상속을 통해 코드를 재사용하고 확장하기 용이합니다.
• 유지보수성: 캡슐화를 통해 코드 변경의 영향을 최소화할 수 있습니다.
• 생산성: 잘 설계된 객체는 독립적으로 개발하고 테스트할 수 있습니다.
• 확장성: 새로운 기능을 추가하기 용이하며, 기존 코드를 덜 변경하고도 기능을 확장할 수 있습니다.

• 설계에 많은 시간과 노력이 필요할 수 있습니다.
• 클래스 계층 구조가 복잡해지면 이해하기 어려워질 수 있습니다.
• 상속의 깊이가 깊어지면 특정 변화가 예기치 않은 곳에서 문제를 일으킬 수 있습니다 (상속의 문제).

함수형 프로그래밍

함수형 프로그래밍(FP)은 프로그램을 순수 함수(Pure Function)들의 조합으로 생각하고, 데이터의 불변성(Immutability)을 강조하는 패러다임입니다.

상태 변경과 부작용(Side Effect)을 최소화하여 코드의 예측 가능성을 높이고 버그 발생 가능성을 줄이는 데 중점을 둡니다.

FP의 핵심 개념은 다음과 같습니다.

// 순수 함수 (Pure Function)
function add(a, b) {
    return a + b; // 항상 동일한 입력에 동일한 출력, 외부 상태 변경 없음
}

// 순수하지 않은 함수 (Impure Function) 예시
let total = 0;
function addToTotal(num) {
    total += num; // 외부 변수 total을 변경 (부작용)
    return total;
}
// console.log() 또한 부작용입니다.

// 불변성 유지 (배열 복사)
const originalArray = [1, 2, 3];
const newArray = [...originalArray, 4]; // 전개 구문으로 새로운 배열 생성

console.log(originalArray); // 결과: [1, 2, 3] (원본은 변경되지 않음)
console.log(newArray);    // 결과: [1, 2, 3, 4]

// 불변성 유지 (객체 복사)
const originalUser = { name: "Alice", age: 30 };
const updatedUser = { ...originalUser, age: 31 }; // 새로운 객체 생성

console.log(originalUser); // 결과: { name: 'Alice', age: 30 } (원본은 변경되지 않음)
console.log(updatedUser);  // 결과: { name: 'Alice', age: 31 }

const numbers = [1, 2, 3, 4, 5];

// map: 배열의 각 요소에 함수를 적용하여 새로운 배열 반환 (불변성 유지)
const squaredNumbers = numbers.map(num => num * num);
console.log(squaredNumbers); // 결과: [1, 4, 9, 16, 25]

// filter: 조건에 맞는 요소만 걸러내어 새로운 배열 반환 (불변성 유지)
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // 결과: [2, 4]

// reduce: 배열의 모든 요소를 하나의 값으로 축소
const sum = numbers.reduce((accumulator, current) => accumulator + current, 0);
console.log(sum); // 결과: 15

reduce의 합은 누적값 0 → 1 → 3 → 6 → 10 → 15로 확인할 수 있습니다. 이 map·filter 콜백은 원소를 변경하지 않지만, 메서드 이름 자체가 순수성을 보장하지는 않습니다. 콜백에서 입력 객체를 수정하면 새 배열을 반환해도 원본의 중첩 값은 달라질 수 있습니다.

같은 잔액 변경을 순수 함수로 표현하기

다음 함수는 입력 잔액을 바꾸는 대신 새 잔액을 반환합니다. 유효하지 않은 금액에서는 예외를 던지는 계약을 코드에 적습니다.

function depositValueForPractice(balance, amount) {
    if (!Number.isFinite(balance) || balance < 0 ||
        !Number.isFinite(amount) || amount <= 0) {
        throw new Error("유한한 잔액과 양수 입금액이 필요합니다.");
    }
    return balance + amount;
}
const previousBalanceForPractice = 10000;
const nextBalanceForPractice = depositValueForPractice(previousBalanceForPractice, 5000);
console.log(previousBalanceForPractice, nextBalanceForPractice);

출력 10000 15000에서 이전 값과 다음 값을 따로 보관할 수 있습니다. 함수 안에서 DOM·로그를 변경하지 않으며, console.log는 결과를 관찰하는 바깥 코드입니다. 금액의 숫자 범위를 검증하는 예시이고 실제 화폐의 소수 처리·동시 입금 문제까지 구현한 코드는 아닙니다.

설계 연습

입금 후 이전 잔액 10000으로 되돌리기 기능이 필요합니다. 위 코드에 다시 2000을 입금한 다음 값도 저장하고, 세 잔액을 출력하세요. 원래 Account 예시를 그대로 사용할 때 되돌리기에 무엇을 추가로 기록해야 하는지도 비교하세요.

• 예측 가능성: 순수 함수와 불변성으로 인해 코드의 동작을 예측하기 쉽습니다.
• 테스트 용이성: 부작용이 없어 단위 테스트 작성이 매우 용이합니다.
• 병렬 처리: 데이터 변경이 없으므로 병렬 프로그래밍에 유리합니다.
• 모듈성: 함수 단위로 코드가 잘 분리되어 재사용성이 높습니다.

• 데이터 불변성을 유지하기 위한 추가적인 복사 작업이 성능에 영향을 줄 수 있습니다.
• 복잡한 상태 관리가 필요한 경우, 데이터 흐름이 다소 복잡해질 수 있습니다.
• 익숙하지 않은 개발자에게는 초기에 학습 곡선이 높을 수 있습니다.

자바스크립트에서의 멀티 패러다임 활용

자바스크립트는 객체 지향적 특성(객체 리터럴, 프로토타입, class)과 함수형 특성(함수가 일급 객체, 클로저, 고차 함수)을 모두 강력하게 지원하는 멀티 패러다임(Multi-paradigm) 언어입니다.

따라서 개발자는 상황과 문제의 특성에 따라 두 패러다임을 유연하게 조합하여 사용할 수 있습니다.

• 객체 지향: 잔액처럼 오래 유지할 상태와 변경 규칙을 한 소유자가 관리할 때 유용합니다. UI 컴포넌트라는 이름만으로 객체 지향인지 판정하지 않고, 상태와 변경 책임이 실제로 어떻게 묶였는지 봅니다.
• 함수형: 데이터 처리, 변환, 상태 관리의 예측 가능성이 중요할 때, 순수하고 독립적인 유틸리티 함수를 만들 때 강력합니다. 특히 웹 애플리케이션의 상태 변화를 관리하거나, 비동기 작업을 처리할 때 함수형 접근이 빛을 발합니다.

효율적이고 가독성 높은 자바스크립트 코드를 작성하기 위해서는 이 두 패러다임의 장점을 이해하고, 어느 한쪽에 치우치기보다는 문제 해결에 가장 적합한 방식을 선택하여 조합하는 능력을 기르는 것이 중요합니다.

프로그래밍 패러다임 정리

마무리에서는 OOP와 FP를 대립 개념으로 보기보다 문제 특성에 맞춰 조합하는 기준을 확인합니다.

이번 장에서는 자바스크립트 코드를 설계하고 구성하는 주요 사고방식인 프로그래밍 패러다임에 대해 학습했습니다.

특히 객체 지향 프로그래밍(OOP)의 캡슐화, 상속, 추상화, 다형성 원칙과, 함수형 프로그래밍(FP)의 순수 함수, 불변성, 고차 함수 개념을 상세히 살펴보았습니다.

자바스크립트가 멀티 패러다임 언어라는 점을 이해하고, 각 패러다임이 가진 장점과 단점을 바탕으로 실제 개발에서 어떻게 활용될 수 있는지 그 가능성을 보았습니다.

특정 문제에 직면했을 때, 이것을 객체로 모델링하는 것이 좋을까?, 아니면 데이터를 변경하지 않는 순수 함수들의 조합으로 해결하는 것이 더 효율적일까?와 같은 질문을 스스로 던져보며 사고의 폭을 넓히는 것이 중요합니다.

프로그래밍 패러다임을 비교하면 같은 문제도 객체, 함수, 상태 흐름 중 어떤 관점으로 나눌지 판단하기 쉬워집니다.

자바스크립트에서는 한 방식만 고집하기보다 문제의 경계에 맞는 표현을 선택하는 것이 중요합니다.

실무에서는 OOP와 FP를 이분법으로 나누기보다 상태의 수명, 데이터 변환의 빈도, 협업 경계를 보고 조합합니다.

기능을 설계할 때는 상태 수명과 데이터 변환 빈도를 기준으로 객체 지향과 함수형 접근의 우선순위를 판단합니다.

객체 지향과 함수형 프로그래밍은 대립 구도가 아니라 상태의 수명과 데이터 변환 방식을 기준으로 조합하는 선택지입니다.