Memory Leak

Click the button, click the text, and you will have references to Testing hanging around

by Jason Butz

HTML

<button>
  Run The Code
</button>

JavaScript

class Testing {
	constructor(text = 'Hello World') {
    this.text = text;
    this.myHandler = this.myHandler.bind(this);
    
    let el = document.createElement('p');
    el.innerText = 'Hey there!';
    el.addEventListener('click', this.myHandler);
    document.body.appendChild(el);
  }
  
  myHandler(e) {
  	// We have a reference to the class held in this event handler
    //  
    document.body.removeChild(e.target);
    console.log(this.text, e.target);
  }
}

document.querySelector('button').addEventListener('click', () => {
	for(let i = 0; i < 10; i++) {
    new Testing(`Hello World ${i}`);
  }
});