Statically Identifying Class
Dependencies in Legacy
JavaScript Systems: First Results
Leonardo Silva (IFNMG, Brazil)
Marco T. Valente (UFMG, Brazil)
Alexandre Bergel (University of Chile)
SANER ERA, 2017
Slide 2
Slide 2 text
JavaScript dominates the web…
2
src: https://www.codementor.io/learn-programming
Slide 3
Slide 3 text
The language is prototype-based
3
But it is possible to emulate classes in
JavaScript
JavaScript
Slide 4
Slide 4 text
4
4
// function -> class
function Circle (radius) {
// property -> attribute
this.radius = radius;
}
// function -> method
Circle.prototype.getArea = function () {
return (3.14 * this.radius * this.radius)
}
// Circle instance -> object
var myCircle = new Circle (10);
Classes in legacy JavaScript
ECMAScript 5
( ES5 )
JS version
Slide 5
Slide 5 text
5
Heuristics for Class
Identification
Previous Work
• Does Javascript Software Embrace Classes? SANER, 2015
• JSClassFinder: A Tool to Detect Class-like Structures in
JavaScript. CBSoft Tools, 2015
Slide 6
Slide 6 text
6
Goal: Use type inference to identify
class-to-class dependencies
Slide 7
Slide 7 text
Type Inferencer
https://flowtype.org/
7
Slide 8
Slide 8 text
Proposed Approach
8
Slide 9
Slide 9 text
Evaluation Design
1. Select two TypeScript systems
2. Build an “oracle” with all dependencies
3. Transpile TypeScript to JavaScript
4. Apply the proposed approach
5. Measure precision and recall
9
Slide 10
Slide 10 text
Research Questions
• RQ1: What is the accuracy of the proposed
approach in detecting class dependencies?
• RQ2: Do module annotations improve the accuracy
of the proposed approach?
10
var X: Class = require(“fileX.js");
Slide 11
Slide 11 text
11
RQ1 - Accuracy of the Proposed Approach
System
All Dependencies Associations
Precision Recall Precision Recall
INVERSIFYJS 100% 6% 100% 19%
SATELLIZER 100% 44% 100% 85%
Slide 12
Slide 12 text
12
RQ2 - Accuracy Using Module Annotations
System
All Dependencies Associations
Precision Recall Precision Recall
INVERSIFYJS 100% 37% 100% 54%
SATELLIZER 100% 51% 100% 85%
Slide 13
Slide 13 text
Future Work
We plan to…
• Extend our study
• Investigate the causes of false negatives
• Combine static and dynamic analysis
13
Slide 14
Slide 14 text
14
Open Questions
1. Why module annotations do not help to improve
type inference accuracy in some systems?
2. Should one invest in dynamic analysis to detect
class-to-class dependencies in JavaScript?