Javascript Traits Pattern Resources

Question

Could anyone recommend good resources for using traits in javascript? After some searching I mainly find articles about libraries that provide traits functionality, but I was curious about best practices on how to implement traits without a library.

I came across this post on SO, are there any other approaches? Traits in javascript

Any real world examples would be welcome as well.

Thanks.

Answer 1

Two papers that do describe library agnostic pure function based Mixin and Trait approaches for JavaScript are A fresh look at JavaScript Mixins by Angus Croll from May 2011 and The many talents of JavaScript for generalizing Role Oriented Programming approaches like Traits and Mixins from April 2014.

so long

Appendix I

please see also:

• stackoverflow.com :: Traits in javascript
• stackoverflow.com :: How to use mixins properly in Javascript

Appendix II

Since from time to time I'm apparently fiddle with this matter I wan't to add some final thoughts to it ...

The library agnostic approach without too much glue code (as mentioned above) does work only for very fine grained composable units of behavioral reuse. Thus, as long as one does not run into more than 1 or 2 easily resolvable conflicts, patterns based on e.g. Angus Croll's Flight Mixins are the path to follow.

If it comes to real traits, there has to be an abstraction level to it. This layer (e.g. provided as some sort of syntactic sugar like a DSL) needs to hide the complexity e.g. of composing traits from traits or of conflict resolution at a traits apply time (when a trait's behavior gets applied to an object/type).

By now there are 3 examples at SO that from my perspective provide exactly what the OP did ask for …

Any real world examples would be welcome as well.

• stackoverflow.com :: Compostions and mixins in JS
• stackoverflow.com :: Mixins for ES6 classes, transpiled with babel
• stackoverflow.com :: Refactoring legacy mixin-based class hierarchies
• stackoverflow.com :: Multiple inheritance using classes

Answer 2

You can use function to implement traits without a library.

See working example Traits + Inheritance

Thanks to dbarbeau

// Usage __traits(TargetClass, Trait1, Trait2, ...);
// Mix multiple definitions as traits. Properties will be overwritten if names are duplicating. 
function __traits(mixtureTarget) {
    for(var a=1; a < arguments.length; ++a) {
        var mixin = arguments[a];
        for (var p in mixin){ if (mixin.hasOwnProperty(p)){ mixtureTarget[p] = mixin[p]; } };
        Object.getOwnPropertyNames(mixin.prototype).forEach( function(name) {
            mixtureTarget.prototype[name] = mixin.prototype[name];
        });
    }; 
};

Answer 3

I would suggest something simple, along the lines of:

1. Let traits be defined as standard JavaScript objects.

   var equalsTrait = {
       eq: function(obj) {
           return this == obj
       },
       neq: function(obj) {
           return ! this.eq(obj)
       }
   };
   

2. Write a function to extend a given class with your traits (and bind it to a sensible location in the global scope):

   window.Traits = {};
   Traits.addToClass = function(traits, cls) {
       for (var key in traits) {
           if (cls.prototype[key]) {
               alert("Class " + cls + " already has a method named " + key + "!");
           }
           else {
               cls.prototype[key] = traits[key];
           }
       }
   }
   

3. Profit!

Answer 4

Some (limited) information about traits in the trait.js library

Not about Javascript, but a good paper about inheritance systems and traits "Traits: A Mechanism for Fine-grained Reuse". A description of implementation details can be found in "Applying Traits to the Smalltalk Collection Hierarchy". More papers of this type listed on this page.