npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

basicclass

v0.1.0

Published

Bringing [OOP](https://en.wikipedia.org/wiki/Object-oriented_programming "Object Oriented Programming") to JS. Basic Class is meant to bring ease to creating and extending Classes. See [Mozilla's Intro to OOP JS](https://developer.mozilla.org/en-US/docs/W

Downloads

3

Readme

Basic Class

Bringing OOP to JS. Basic Class is meant to bring ease to creating and extending Classes. See Mozilla's Intro to OOP JS for more details.


Version

0.1.0

License

MIT

Dependencies

Usage

// Just an instance (kinda pointless...)
var myObj = new BasicClass();

// Exending for custom classes
var MyClass = BasicClass.extend({
    // Local fields
    myField : undefined, 
    
    // Extend localization of constructor parameters (See base functionality)
    _availableConfig : BasicClass.prototype._availableConfig.concat(['myField']),
    
    constructor : function(parms) {
        // Constructor code here
        this.myMethod(); // Call local method
        
        // Be sure to call 'super' constructor for base class initialization (See base functionality)
        BasicClass.prototype.constructor.apply(this, arguments);
    },
    
    myMethod : function() {
        // Method code here
        alert(this.myField); // Alert local field
    }
},{
    MY_CONSTANT : "A_CONSTANT_EXAMPLE", // Establish a constant/enum that can be used
    MyStaticMethod : function() { alert('statictastic!'); }
});

MyClass.MyStaticMethod(); // Call a static method
var myObj = new MyClass({myField : 'test'}); // Construct myField as 'test'

// Extend custom class
var EvenBetterClass = MyClass.extend({
    constructor : function(parms) {
        parms.myField = parms.myField + "ing"
        MyClass.prototype.constructor.apply(this, arguments);
    }
});
var myObj = new EvenBetterClass({myField : 'test'});
// Now myField will contain 'testing' upon construction

Base Functionality

Base functionality is mostly handled by the constructor of BasicClass. It is optional to run this constructor and provide your own API to your constructor. This was developed as a easy-button use from noticing patterns of Class development in JS.

Unique ID (this._id)

Upon instantiation a unique identifier is generated in order to keep track of this object, for logging or what have you. It plays into Eventer's internal creation of IDs for listeners. This ID is not used - just provided as a nicety. Also utilizes this._idPrefix, which can be overridden, to prefix the ID with a tag. Commonly used to group or easily identify the type of object/class in logs.

Localization and Object Parameter Constructor API

It's most commonly found that the constructor for JS classes will group parameters into an object that's passed in:

var myObj = new MyClass({ parm1 : 'testing', parm2 : 'some', parm3 : 'stuff'});

Not only does this clean up code for legibility but also satisfies code syntax checkers for excess/long parameter lists.
Also found to be common is to save off or 'localize' parameters being passed. Others may only be used in the constructor and forgotten. Those to be saved can be concatenated to the this._availableConfig array:

var MyClass = BasicClass.extend({
    MyClass.prototype.availableConfig.concat(['parm2'])
});

See next section (Events) for why it's concatenated.
With this Class configuration about, the following would be true:

var myObj = new MyClass({ parm1 : 'testing', parm2 : 'some', parm3 : 'stuff'});
myObj.parm1; // undefined - wasn't stored
myObj.parm2; // 'some' - was stored
myObj.parm3; // undefined - wasn't stored

Events

Eventer is mixed in and allows for initial events to be given. The base constructor will go through and register them.
Also the default _availableConfig will accept events to be passed in with the first parameter object and will be merged with those in this.events.

var MyClass = BasicClass.extend({
    events : {
        'myEvent' : 'myFunc'
    },
    // Method executed when 'myEvent' is triggered
    myFunc : function() {},
    
    // Just another method.. for now!
    anotherFunc : function() {}
});

var myObj = new MyClass({
    events : {
        // Add an event to run anotherFunc method!
        'myOtherEvent' : 'anotherFunc'
    }
});