this arrow

by trentHarlem

HTML

<h2>JavaScript "this"</h2>

<p>This example demonstrate that in Arrow Functions, the "this" keyword represents the object that owns the function, no matter who calls the function.</p>

<p>Click the button to execute the "hello" function again, and you will see that "this" still represents the window object.</p>

<button id="btn">Click Me!</button>

<button id="b" onclick='hello2(this)'>No! Click Me! </button>

<p id="demo"></p>
<p id="demo2"></p>

<button id="reset" onclick='location.reload()'>Reset</button>

JavaScript

const hello = () =>
  document.getElementById("demo").innerHTML += this;

const hello2 = x =>
  document.getElementById("demo2").innerHTML += x;

  //The window object calls the function:
  window.addEventListener("load", hello);
window.addEventListener("load", hello2);

//A button object calls the function:
document.getElementById("btn").addEventListener("click", hello);
//document.getElementById("b").addEventListener("click", hello2);