Giter Club home page Giter Club logo

mmclass's Introduction

NPM version Build status Test coverage Codacy badge Downloads

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...)

mmclass's People

Contributors

hax avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.