Mixin 패턴_JavaScript 디자인 패턴 10

一.Mixin 패턴과 코드 재사용

가장 일반적인 코드 재사용 방식은 상속이지만, 서브클래스는 수퍼클래스의 모든 속성을 얻으므로 여분의 속성을 상속받을 수 있습니다. 하나의 해결책은 수퍼클래스의 속성을 여러 인터페이스 클래스로 분할하고, 서브클래스가 이러한 인터페이스 클래스에서 상속이 필요한 속성을 "스스로 가져가"도록 하는 것이지만, Java 의 인터페이스는 완전히 추상적이며 (구현을 포함하지 않음), 코드 재사용을 구현할 수 없습니다. 컴포지션을 사용하면 이 문제를 완화할 수 있지만, 근본적으로 해결할 수는 없으며, 컴포지션은 각 의존 객체에 대한 참조를 유지하고, 이基础上에서 다시 캡슐화하여 인터페이스를 제공해야 하므로 복잡성이 증가합니다

기존 객체의 일부 속성만 재사용하고 싶은 경우, Mixin 패턴은 의심할 여지 없이 최선의 선택입니다. 복잡한 클래스 계층 관계를 전혀 고려할 필요가 없기 때문입니다. 기존 상속 메커니즘基础上에서, 부분적 상속 (수퍼클래스에서 필요한 일부 속성만 가져오기) 과 다중 상속 (여러 수퍼클래스에서 속성 가져오기) 을 구현할 수 있기를 바라지만, Mixin 패턴은 바로 이 일을 합니다

二.Mixin 패턴의 구현

Mixin 패턴의 구현은 실제로 속성 복사의 일종입니다. 샘플 코드는 다음과 같습니다:

// 부품 창고 1
function Moveable() {}
Moveable.prototype.walk = function() {
    console.log('walked slowly');
}
Moveable.prototype.run = function() {
    console.log('ran quickly');
}
Moveable.prototype.jump = function() {
    // ...
}
// 부품 창고 2
function Souled() {}
Souled.prototype.smile = function(age) {
    console.log('smiled as ' + age + ' year\'s old kid');
}
// 부품 창고 3

// mixin
function augment(sub, sup) {
    // 継承所有属性
    if (arguments.length === 2) {
        for(var attr in sup.prototype) {
            sub.prototype[attr] = sup.prototype[attr];
        }
    }
    // 継承部分属性
    else if(arguments.length > 2) {
        for (var i = 2; i < arguments.length; i++) {
            sub.prototype[arguments[i]] = sup.prototype[arguments[i]];
        }
    }
    else {
        // do nothing
    }
}

// 需要増强的类
function Robot(name) {
    this.name = name;
}

// 増強
augment(Robot, Moveable, 'walk', 'run');    // Moveable 에서 walk 와 run 을 상속
augment(Robot, Souled);                     // Souled 의 전체 속성 상속

// test
var robot = new Robot('little boy');
robot.walk();       // walked slowly
robot.run();        // ran quickly
robot.smile(12);    // smiled as 12 year's old kid

부분적 상속과 다중 상속을 쉽게 구현할 수 있으며, 고전적인 상속 메커니즘의 속박을 해제하여 코드 재사용을 더욱 유연하게 합니다

일부 JS 라이브러리는 Mixin 의 구현을 제공합니다. 예를 들어 Underscore 의 _.extend 메서드, JQuery 의 extend 메서드, YUI 의 mix/augment/extend/merge 메서드 등입니다

三.Mixin 패턴의 단점

Mixin 은 매우 유연한 코드 재사용 방식이지만, 기능을 프로토타입 객체에 주입하면 프로토타입 오염과 함수의 출처에 대한 불확실성이 발생하며, 대규모 시스템에서는 심각한 문제가 될 수 있습니다. 자세한 문서를 통해 함수의 출처가 불확실하다는 문제를 해결할 수 있지만, 프로토타입 오염은 피할 수 없습니다

참고 자료

• 『JavaScript 디자인 패턴』

• 掺合模式（Mixin）