Mixins with state in JavaScript

Question

If I understand correctly mixins can have state, whereas traits, as a subset of mixins, cannot.

How can we implement stateful mixins in JavaScript.

I can think of two ways - partial application and via closure. Are there any others?

For example:

var foo, bar, bam, closedOver = 'c';

foo = { a: function() { console.log('a'); } };
bar = { b: (function(x) { console.log('b: ' + x); }.bind(this, '1')) };
bam = { c: function() { console.log(closedOver); } };

function mix(original, ...objs) {
  objs.forEach(o => {
    Object.keys(o).forEach(k => { 
      original[k] = o[k]; 
    });
  });
}

mix(foo, bar, bam);

console.log(foo.a); // a
console.log(foo.b); // b: 1
console.log(foo.c); // c

Edit: I just realised that of course functions are objects in JavaScript and can have arbitrary state associated with them. I would like to know the answer to an ancillary question - do mixins have to be functions?

Your `mix` function doesn't make sense, and is never called. — Bergi, Mar 09 '15 at 19:57

score 2 · Accepted Answer · edited Mar 09 '15 at 20:16

2

Per-instance state must be created in the constructor. Therefore, mixins that need state have some kind of init method that can be called from a class constructor.

edited Mar 09 '15 at 20:16

Ben Aston

53,718
65
205
331

answered Mar 09 '15 at 19:59

Bergi

630,263
148
957
1,375

score 0 · Answer 2 · answered Apr 27 '15 at 19:15

How can we implement stateful mixins in JavaScript.

.

Edit: I just realised that of course functions are objects in JavaScript and can have arbitrary state associated with them. I would like to know the answer to an ancillary question - do mixins have to be functions?

Not necessarily - mixin approaches based on plain objects and [libraryName].extends are much more widespread in production than function based ones.

But especially with state, my strong opinion is that a function based approach is most natural for this languages design since it does provide delegation for free and at the same time also enables injecting of and passing around state.

I do recommend reading 2 papers, both are covering a library agnostic pure function based approach for Mixins / Traits / Talents.

A fresh look at JavaScript Mixins by Angus Croll from May 2011
The many talents of JavaScript for generalizing Role Oriented Programming approaches like Traits and Mixins from April 2014.

Note: the 2nd link does promote an article of mine.

Mixins with state in JavaScript

2 Answers2