Coder Social home page Coder Social logo

abitbol's Introduction

Abitbol

Build Status NPM Version License

Abitbol is a small Javascript library that provides consistent/easy to use classes for Node.js and web browsers. It is heavily inspired by Armin Ronacher's Classy library, but extends its possibilities.

Features:

  • Simple inheritance
  • Consistent this (always points to the current instance)
  • Annotations
  • Computed properties automatically generated from getters and setters
  • Simple way to call a super class method
  • Simple way to declare static properties
  • Handful mixin

The classiest javascript class library of the world
-- George Abitbol

George Abitbol

Getting Started

Standalone Version (browser)

To use the standalone version, first download the latest zip or clone the git repository:

git clone https://github.com/wanadev/abitbol.git

Then, just include one of the javascript of the dist/ folder:

<script src="dist/abitbol.js"></script>

NPM

To use Abitbol with Node.js (or in the browser using Browserify), first install the library:

npm install --save abitbol

Then require it when needed:

var Class = require("abitbol");

Using Abitbol

Defining Classes

var Vehicle = Class.$extend({
    __init__: function (color) {
        this.color = color;
        this.speed = 0;
    },
    
    move: function (speed) {
        this.speed = speed;
    },
    
    stop: function () {
        this.speed = 0;
    }
});

Creating Subclases

var Car = Vehicle.$extend({
    __init__: function (color) {
        this.$super(color);
        this.maxSpeed = 180;
    },
    
    move: function (speed) {
        speed = Math.min(speed, this.maxSpeed);
        this.$super(speed);
    },
    
    horn: function () {
        alert("BEEP BEEP");
    }
});

var Truck = Car.$extend({
    __init__: function (color) {
        this.$super(color);
        this.maxSpeed = 90;
    },

    horn: function () {
        alert("HONK HONK");
    }
});

Using Your Classes

var mustang = new Car("red");
mustang.move(120);
mustang.horn();

var myTruck = new Truck("blue");
myTruck instanceof Car  // true

Computed Properties (Getters and Setters)

Abitbol allows you to creates computed properties simply by defining getters and setters:

var Person = Class.$extend({

    // This will create the Person.fullName property
    
    getFullName: function () {
        return this.$data.fullName;
    },
    
    setFullName: function (value) {
        this.$data.fullName = value;
    },
    
    // This will create the Person.age property
    
    getAge: function () {
        return this.$data.age;
    },
    
    setAge: function (value) {
        this.$data.age = value;
    },
    
    // This will create the read-only Person.old property
    
    isOld: function () {
        return (this.age > 75);
    },
    
    // This will create the read-only Person.woodenLeg property
    
    hasWoodenLeg: function () {
        return (this.fullName == "Long John Silver");
    }
})

and playing with those properties is straightforward:

var george = new Person();

george.fullName = "George Abitbol";
george.age = 50;

console.log(george.fullName);       // "George Abitbol"
console.log(george.getFullName());  // "George Abitbol"
console.log(george.old);            // false
console.log(george.isOld());        // false

george.setAge(80);

console.log(george.old);            // true

Annotations

Abitbol classes supports annotations. To add annotations, just defines them in non-assigned strings at the top of the function:

var MyClass = Class.$extend({
    myMethod: function () {
        "@annotation1 value";
        "@annotation2";
        
        // ... Method's code here
    }
});

The annotations are accessible through the Class.$map object:

console.log(MyClass.$map.methods.myMethod.annotations);

// {
//     annotation1: "value",
//     annotation2: true
// }

see the documentation about the Class.$map object bellow for more informations.

Class API

Class.$extend(properties)

Creates a new class that extends the given class.

Class.$class / this.$class

The class object for this instance.

this.$super()

From a method: invokes the corresponding super class method.

this.$name

From a method: the current method's name.

this.$computedPropertyName

From a getter/setter method: the name of the related computed property.

Class.$map / this.$map

An object that contains the class' map (list of methods, attributes,...).

{
    attributes: {
        attr1: true,
        attr2: true,
        ...
    },
    methods: {
        meth1: {
            annotations: {
                key: "value"
            }
        },
        meth2: {
            annotations: {}
        },
        ...
    },
    computedProperties: {
        prop1: {
            get: "getProp1",
            set: "setProp1",
            annotations: {
                key: "value"
            }
        },
        prop2: {
            get: "isProp2",
            annotations: {}
        },
        ...
    }
}

this.$data

An object to store private internal properties (to store computed properties' values for example).

Class.__init__()

The constructor method.

Class.__include__

A list of objects that contains properties to mix in the class.

var Boat = Vehicle.$extend({
    __include__: [{
        horn: Truck.prototype.horn
    }],
    
    navigate: function (speed) {
        this.move(speed);
    }
});

Class.__classvars__

An object containing static properties of the class.

var MyClass = Class.$extend({
    __classvars__: {
        staticAttribute: "value",
        staticMethod: function () {}
    }
});

Changelog

  • 1.0.3: Allow computed properties' accessors and mutators to be monkey-patched.
  • 1.0.2: Do not wrap methods when it is not necessary.
  • 1.0.1: Fixes context issue with nested method calls.
  • 1.0.0: Computed properties generated from accessors and mutators (get/set), annotations, proper this.
  • 0.1.0: Equivalent to Classy (except Class.$classyVersion, Class.$withData(), Class.$noConflict() that are not implemented).

abitbol's People

Contributors

flozz avatar yofreke 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.