[ES6] 믹스인(Mixin) 패턴, Object.assign()

[devSoyoung]

• 프로토타입을 바꾸지 않고, 한 객체의 프로퍼티를 다른 객체에게 복사해서 사용하는 방식

상속 관련 참고 글 : JavaScript Inheritance: Pseudoclassical vs. Prototypal

Mixin 구현

function mixin(receiver, supplier) {
  Object.keys(supplier).forEach(function(key) {
    receiver[key] = supplier[key];
  });

  return receiver;
}

Mixin 패턴의 활용

• 기존 객체의 기능을 그대로 가져가면서 다른 객체에 추가할 때
• 이벤트 지원 : 상속보다 Mixin이 나음

Reference

• https://vnthf.github.io/blog/mixin/

[devSoyoung]

[ES6] Object.assign()

• 열거할 수 있는 하나 이상의 출처 객체로부터 대상 객체로 속성을 복사하여 대상 객체를 반환

underscore의 Mixin 구현

  // Helper function to continue chaining intermediate results.
  var chainResult = function(instance, obj) {
    return instance._chain ? _(obj).chain() : obj;
  };

  // Add your own custom functions to the Underscore object.
  _.mixin = function(obj) {
    _.each(_.functions(obj), function(name) {
      var func = _[name] = obj[name];
      _.prototype[name] = function() {
        var args = [this._wrapped];
        push.apply(args, arguments);
        return chainResult(this, func.apply(_, args));
      };
    });
    return _;
  };