mmclass
v0.4.2
Published
ES5 Class util which follow the semantics of ES6 max-min class
Downloads
3
Readme
What is MMClass
MMClass is just another JavaScript Class factory, like Class in Prototype, MooTools or Base2. But it follow the semantics of ES6 max-min class draft, so all codes written with MMClass are expected to be compatible with ES6.
Example
ES 6 syntax:
Class Pet {
constructor(name) {
this._name = name
}
speak() {
console.log(this._name + ' says...')
}
}
Class Dog extends Pet {
constructor(name) {
super(name)
}
woof() {
return 'Woof, woof!'
}
speak() {
super.speak()
console.log(this.woof() + " I'm a dog, pet me!")
}
}
Class Cat extends Pet {
meow() {
return 'Meow ~~'
}
speak() {
super.speak()
console.log(this.meow() + " I'm a cat, go away!")
}
}
ES5 version with MMClass:
var Pet = Class({
constructor: function(name) {
this._name = name
},
speak: function() {
console.log(this._name + ' says...')
}
})
var Dog = Class.extend(Pet)({
constructor: function($super, name) {
$super(name)
},
woof: function() {
return 'Woof, woof!'
},
speak: function($super) {
$super.speak()
console.log(this.woof() + " I'm a dog, pet me!")
}
})
var Cat = Class.extend(Pet)({
// if no constructor provided,
// default to constructor(...args) { super(...args) }
meow: function() {
return 'Meow ~~'
},
speak: function($super) {
$super.speak()
console.log(this.meow() + " I'm a cat, go away!")
}
})
var dog = new Dog('Odie')
dog.speak() // Output: Odie says... Woof, woof! I'm a dog, pet me!
var cat = new Cat('Garfield')
cat.speak() // Output: Garfield says... Meow ~~ I'm a cat, go away!
More info about ES6 Class/ES5 MMClass
You can extend a traditional ES5 constructor function
function Pet(name) {
this._name = name
}
Pet.prototype.speak = function() {
console.log(this._name + ' says...')
}
ES6:
class Dog extends Pet {...}
MMClass:
var Dog = Class.extend(Pet)({...})
Note: As ES6, Dog.[[prototype]] should be Pet so that Dog class can inherit all "static" properties on Pet. MMClass follow this semantic via setting __proto__ . Most engines support this pseudo property, if it's not supported, MMClass will copy all properties.
You also can extend an object directly (aka. prototype-based inheritance)
var pet = {
constructor: function(name) {
this._name = name
},
speak: function() {
console.log(this._name + ' says...')
}
}
ES6:
class Dog extends pet {...}
MMClass:
var Dog = Class.extend(pet)({...})
You even can extend null to avoid inheriting the properties from Object.prototype (such as isPrototypeOf/hasOwnProperty/propertyIsEnumerable)
ES6:
class NakedObject extends null {}
MMClass:
var NakedObject = Class.extend(null)()
Usage
Note: MMClass requires ES5 environment. You can try es5-shim for legacy browsers (though untested yet).
my.js
'use strict'
'import Class from "$PATH_TO/mmclass/src/class.js"'
...
See my.js for more info
NodeJS
Installation:
npm i mmclass
Source:
var Class = require('mmclass').Class
...
AMD / CMD
define(function(require, exports) {
var Class = require('$PATH_TO/mmclass/dist/mmclass').Class
...
}
Browser
<script src="$PATH_TO/mmclass/dist/mmclass"></script>
TODO
- Check the recent released ES6 draft to follow the changes (the standard draft is changing dramatically...)