본문 바로가기
Language/JavaScript

팩토리 패턴(Factory Pattern) 예시 - 자바스크립트(JavaScript ES5/ES6)

by DevPark 2024. 5. 7.

자바스크립트로 구현한 팩토리 패턴을 번역하여 소개합니다. 

상황과 그에 대한 솔루션을 전통적인 객체지향적 디자인패턴과 다르게 자바스크립트스럽게(?) 구현된 예제입니다.

객체지향적으로 설계한 코드도 확인할 수 있습니다.  

자세한 내용은 아래 원문을 참고해주세요.

 

GitHub - Badacadabra/JavaScript-Design-Patterns: :paperclip: ES5 + ES6 + CoffeeScript + TypeScript design patterns with some the

:paperclip: ES5 + ES6 + CoffeeScript + TypeScript design patterns with some theory, real-world examples and UML diagrams - Badacadabra/JavaScript-Design-Patterns

github.com


개요 (Synopsis)

저는 GNU/Linux 배포판의 팬입니다.
Debian, RedHat, Slackware와 같은 주요 배포판을 테스트하고 싶습니다.

 

문제 (Problem)

Debian, RedHat 및 Slackware는 모두 Linux 배포판입니다. 

우리는 각각을 나타내는 객체 리터럴을 모두 직접 만들 수 있지만,  모두 만드는 것이 반드시 최선의 선택은 아닙니다.

우리는 각 인스턴스를 사용할지 확신할 수 없습니다. 그리고 사용하지 않는 인스턴스에 메모리를 낭비하고 싶지 않습니다.

명확성과 성능을 위해 인스턴스화 로직을 위임하는 것이 좋을 수 있습니다.

해결방법 (Solution)

팩토리 패턴을 통해 인스턴스화 로직을 구현할 수 있습니다.

팩토리 패턴을 구현하기 위해서는 객체를 반환할 함수를 생성하면 됩니다.
자바스크립트에서 객체를 반환하는 함수나 메서드는 일반적으로 팩토리로 간주됩니다.

이것은 "new" 키워드를 생성자 함수와 함께 사용하는 것에 대한 잘 알려진 관용적 대안입니다.

팩토리 패턴


ES5 버전 

Client  코드 (client.js)

'use strict';

var getLinuxDistro = require('./API/factory');

// ==============================
// CLIENT CODE 
// ==============================

var debian = getLinuxDistro("DEBIAN"),
    redhat = getLinuxDistro("RedHat"),
    slackware = getLinuxDistro("slackware");

console.log(debian.boot()); // Debian is booting...
console.log(redhat.boot()); // RedHat is booting...
console.log(slackware.boot()); // Slackware is booting...

 

API 코드 (factory.js)

'use strict';

// ==============================
// FACTORY OF GNU/LINUX DISTROS
// ==============================

module.exports = function (name) {
    name = name.toLowerCase();
    switch (name) {
        case "debian":
            return {
                name: name.charAt(0).toUpperCase(),
                boot: function () {
                    return "Debian is booting...";
                }
            }
        case "redhat":
            return {
                name: name.charAt(0).toUpperCase(),
                boot: function () {
                    return "RedHat is booting...";
                }
            }
        case "slackware":
            return {
                name: name.charAt(0).toUpperCase(),
                boot: function () {
                    return "Slackware is booting...";
                }
            }
        default:
            throw {
                type: "Not found",
                message: "The Linux distribution you are looking for has not been found."
            }
    }
};

ES6 버전 

Client  코드 (client.js)

import getLinuxDistro from './API/factory';

// ==============================
// CLIENT CODE 
// ==============================

// Creation of our objects through the factory
let debian = getLinuxDistro("DEBIAN"),
    redhat = getLinuxDistro("RedHat"),
    slackware = getLinuxDistro("slackware");

console.log(debian.boot()); // Debian is booting...
console.log(redhat.boot()); // RedHat is booting...
console.log(slackware.boot()); // Slackware is booting...

 

API 코드 (factory.js)

// ==============================
// FACTORY OF GNU/LINUX DISTROS
// ==============================

export default name => {
    name = name.toLowerCase();
    switch (name) {
        case "debian":
            return {
                name: name.charAt(0).toUpperCase(),
                boot() {
                    return "Debian is booting...";
                }
            }
        case "redhat":
            return {
                name: name.charAt(0).toUpperCase(),
                boot() {
                    return "RedHat is booting...";
                }
            }
        case "slackware":
            return {
                name: name.charAt(0).toUpperCase(),
                boot() {
                    return "Slackware is booting...";
                }
            }
        default:
            throw {
                type: "Not found",
                message: "The Linux distribution you are looking for has not been found"
            }
    }
};
반응형

댓글