JSClassFinder

A tool to detect class-like structures in legacy JavaScript code (i.e., prior to ECMAScript 6).

Example of Class detected by JSClassFinder

function Circle (radius) { //  class
   this.radius= radius; // attribute
   this.getArea= function () { // method
     return (3.14 * this.radius * this.radius);
   }
 }
 
 var myCircle = new Circle (10); // Circle instance
 
 function Circle2D (x, y) { // class Circle2D
   this.x = x;
   this.y= y;
 }

// Circle2D is a subclass of Circle
Circle2D.prototype = new Circle(10);

// Circle2D extends Circle with new methods
Circle2D.prototype.getX = function () {
  return (x);
}
Circle2D.prototype.getY = function () {
  return (y);
}

Example of Class Diagram Generated by JSClassFinder (for algorithm.js)

Data about Class Emulation in 60 JavaScript systems

Installation

JSClassFinder is implemented in Pharo (a Smalltalk-like language)
You can download a ready-to-use Pharo image here, or use the instructions below to install JSClassFinder inside your own Pharo image:
1 – Open Monticello browser
2 – Add a new repository (+Repository) of type HTTP
3 – Fill in the required information as below
 MCHttpRepository
    location: 'http://smalltalkhub.com/mc/LeonardoHumberto/JSClasses/main'
    user: ''
    password: ''
4 – Choose the newest release

Input

JSClassFinder expects the AST of a JS source code, in JSON format, as input.
To generate the AST we use Esprima.
Use the instructions below to use Esprima under Node.js:
1- install Node.js
2- load Esprima package : “npm install esprima”
3- Ok, you are ready to execute Esprima commands.

The file analyse.js is one example of script that can be used to generate JSON files.

More Info

Leonardo Humberto Silva, Marco Tulio Valente, Alexandre Bergel, Nicolas Anquetil, Anne Etien. Identifying Classes in Legacy JavaScript Code. Journal of Software: Evolution and Process, vol. 29, n. 8, pages 1-20, 2017. Paper

Leonardo Humberto Silva, Miguel Ramos, Marco Tulio Valente, Nicolas Anquetil, Alexandre Bergel. Does Javascript Software Embrace Classes? In 22nd International Conference on Software Analysis, Evolution and Reengineering (SANER) , pages 1-10, 2015. Paper, Slides

Download

Ready-to-use Pharo image with JSClassFinder installed
JSClassFinder packages on SmalltalkHub
Dataset for SANER paper