JSFiddle - React, Tailwind, and code Playground
HTML
<button onclick="createInline()">
Inline
</button>
<button onclick="createPrototype()">
Prototype
</button>
JavaScript
class MethodsOnPrototype {
constructor(x, y){
this.x = x;
this.y = y;
}
xPlusY(){
return this.x + this.y;
}
xTimesY(){
return this.x * this.y;
}
xMinusY(){
return this.x - this.y;
}
xDividedY(){
return this.x / this.y;
}
yPlusX(){
return this.y + this.x;
}
yTimesX(){
return this.y * this.x;
}
yMinusX(){
return this.y - this.x;
}
yDividedX(){
return this.y / this.x;
}
}
class MethodsInline {
constructor(x, y){
this.x = x;
this.y = y;
this.xPlusY = () => {
return this.x + this.y;
}
this.xTimesY = () => {
return this.x * this.y;
}
this.xMinusY = () => {
return this.x - this.y;
}
this.xDividedY = () => {
return this.x / this.y;
}
this.yPlusX = () => {
return this.y + this.x;
}
this.yTimesX = () => {
return this.y * this.x;
}
this.yMinusX = () => {
return this.y - this.x;
}
this.yDividedX = () => {
return this.y / this.x;
}
}
}
window.createPrototype = function(){
createThem(MethodsOnPrototype)
}
window.createInline = function(){
createThem(MethodsInline)
}
window.allInstances = [];
function createThem(T){
for (let i = 1; i <= 250; i++){
for (let j = 1; j <= 2; j++){
allInstances.push(new T(i, j));
}
}
console.log(allInstances.length, 'created')
}