All Projects → qubyte → mixomatic

qubyte / mixomatic

Licence: MIT License
Create mixins which work with instanceof (friendly for unit tests).

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to mixomatic

go-traits
A concept package that helps implement mixin behavior using embedded structs and hook interfaces.
Stars: ✭ 21 (+0%)
Mutual labels:  mixins, mixin
vue-reactive-provide
Plugin/Mixin wrapping Vue's static 'provide/inject' feature allowing to easily pass reactive data to children
Stars: ✭ 113 (+438.1%)
Mutual labels:  mixins
buttono
A flexible Sass mixin for creating BEM-style buttons.
Stars: ✭ 82 (+290.48%)
Mutual labels:  mixins
ClientAPI
API designed to make Minecraft "Utility Mods" have Universal Support
Stars: ✭ 58 (+176.19%)
Mutual labels:  mixin
hagrid
📏 Hagrid is a mixin library for responsive websites and web applications.
Stars: ✭ 30 (+42.86%)
Mutual labels:  mixins
website
Prometheus monitoring mixins
Stars: ✭ 91 (+333.33%)
Mutual labels:  mixins
ModernUI
Modern desktop framework from low-level 3D graphics API to high-level view model, for development of 2D/3D rendering software or game engine, with internationalization support and many new technologies.
Stars: ✭ 168 (+700%)
Mutual labels:  mixin
Crucible
Crucible is a Thermos fork containing various patches for bug fixes and performance improvements. Join our discord to stay updated with the project development.
Stars: ✭ 67 (+219.05%)
Mutual labels:  mixins
mixin-sdk-go
Golang sdk for Mixin Network & Mixin Messenger
Stars: ✭ 36 (+71.43%)
Mutual labels:  mixin
sloped-edge
Sass mixin that helps you build sloped section edges with a consistent angle.
Stars: ✭ 85 (+304.76%)
Mutual labels:  mixin
family.styl
port of family.scss to stylus
Stars: ✭ 19 (-9.52%)
Mutual labels:  mixins
Orion
Mixin loader for Paper
Stars: ✭ 46 (+119.05%)
Mutual labels:  mixins
vue-global-var
Reactive global variable can be sharable between components
Stars: ✭ 21 (+0%)
Mutual labels:  mixins
orchparty
Write your own orchestration config with a Ruby DSL that allows you to have mixins, imports and variables.
Stars: ✭ 37 (+76.19%)
Mutual labels:  mixins
flexbox-grid-mixins
Sass Mixins to generate Flexbox grid
Stars: ✭ 67 (+219.05%)
Mutual labels:  mixin
vue-in-viewport-mixin
Vue 2 mixin to determine when a DOM element is visible in the client window
Stars: ✭ 99 (+371.43%)
Mutual labels:  mixin
Mixin
React.js like Mixin. More powerful Protocol-Oriented Programming.
Stars: ✭ 45 (+114.29%)
Mutual labels:  mixins
scss-font-lock
This is a SCSS mixin used to create CSS locks for responsive typography. To make in convenient to use it allows you to use both px and em as units and if anything goes wrong, it will let you know during the compile using scss @warn and also print an error message on top of the text in the application or website.
Stars: ✭ 18 (-14.29%)
Mutual labels:  mixin
pando
Pando is a decentralized financial network built with the MTG technology, and its underlying financial algorithm is inspired by Maker and Synthetix.
Stars: ✭ 12 (-42.86%)
Mutual labels:  mixin
floggy
Customizable logger for dart and flutter applications.
Stars: ✭ 61 (+190.48%)
Mutual labels:  mixins

mixomatic

Create mixins which work with instanceof (friendly for unit tests). Internally references are handled by a WeakSet instances so there's no need to manually keep records of which objects have been mixed onto and risk memory leaks.

Install

With npm:

npm install --save mixomatic

With yarn:

yarn add mixomatic

Or alternatively, in a browser or deno you can use it directly in a page via unpkg as a module (not recommended for production use):

import mixomatic from 'https://unpkg.com/mixomatic';

Usage

Make a new mixin which appends propertyDescriptors to an object.

import mixomatic from 'mixomatic';

const myMixin = mixomatic(propertyDescriptors);

Mix onto an object.

const obj = {};

myMixin(obj);

Check if an object has been modified by a given mixin:

obj instanceof myMixin; // true

Also works with classes!

class MyClass {}

myMixin(MyClass.prototype);

const obj = new MyClass();

obj instanceof MyClass; // true
obj instanceof myMixin; // true

And inheritance!

class MyChildClass extends MyClass {}

const obj = new MyChildClass();

obj instanceof MyChildClass; // true
obj instanceof MyClass;      // true
obj instanceof myMixin;      // true

Example

You're making a game with a little ship which shoots space-bound rocks before they can bash into it. Both the ship and the rocks have position and velocity properties. You could make a class, which provides a move method, which they would both inherit from. However, that could be the beginning of a class hierarchy and you've heard bad things about those being hard to modify in the future. JavaScript also has no way to do multiple inheritance with classes, so your options are limited with classes anyway.

Instead you make the wise choice to use mixomatic! You use mixomatic to create a mixin called movable, which takes a time difference and uses it to update the position of its host object.

const movable = mixomatic({
  move: {
    value(dt) {
      this.position.x += dt * this.velocity.x;
      this.position.y += dt * this.velocity.y;
    },
    configurable: true,
    enumerable: false,
    writable: true
  }
});

Since there'll only be one ship, you define it directly as an object and apply movable to it to give it the move method.

const ship = {
  position: { x: 0, y: 0 },
  velocity: { x: 0, y: 0 }
};

movable(ship);

Asteroids are more numerous and can appear in all sorts of places, so you decide to go with a class for those.

class Asteroid {
  constructor(position, velocity) {
    this.position = { x: position.x, y: position.y };
    this.velocity = { x: velocity.x, y: velocity.y };
  }
}

movable(Asteroid.prototype);

Now both ship and Asteroid instances will have the move method, and will both appear to be instances of movable, yet are not part of the same class hierarchy. All sorts of behaviour can be written as mixins (for example, the ship can fire missiles, and so can UFOs).

This is useful because mixins can be tested in isolation, and you can avoid duplication of tests for mixed properties by using an instanceof check in the test suites of host objects like ship and Asteroid.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].