Constructor Pattern
Create multiple instances of script that share methods but contain unique information.
Example: a DOM manipulation library like jQuery.
Change MyPlugin
to whatever namespace you’d like to use for your plugin. Constructors start with a capital letter.
Examples
// Create a new instance of the constructor
var headings = new MyPlugin('h2');
// Run a method
headings.addClass('heading-big');
The Boilerplate
/*!
* Constructor Pattern Boilerplate
* (c) 2019 Chris Ferdinandi, MIT License, https://gomakethings.com
*/
var MyPlugin = (function () {
'use strict';
//
// Methods
//
/**
* Create the Constructor object
*/
var Constructor = function (selector) {
this.nodes = document.querySelectorAll(selector);
};
/**
* Loop through each element
*/
Constructor.prototype.forEach = function (callback) {
for (var i = 0; i < this.nodes.length; i++) {
callback(this.nodes[i], i);
}
};
/**
* Add a class to each element
*/
Constructor.prototype.addClass = function (className) {
this.forEach(function (node) {
node.classList.add(className);
});
};
//
// Return the Constructor
//
return Constructor;
})();