प्रतिक्रिया ES6 तीर कार्य

पहले:

hello = function() {
  return "Hello World!";
}

तीर समारोह के साथ:

hello = () => {
  return "Hello World!";
}

डिफ़ॉल्ट रूप से एरो फ़ंक्शंस रिटर्न वैल्यू:

hello = () => "Hello World!";

पैरामीटर्स के साथ एरो फंक्शन:

hello = (val) => "Hello " + val;

कोष्ठक के बिना तीर समारोह:

hello = val => "Hello " + val;

उदाहरण

एक नियमित फ़ंक्शन के साथ, thisउस ऑब्जेक्ट का प्रतिनिधित्व करता है जिसे फ़ंक्शन कहा जाता है:

class Header {
  constructor() {
    this.color = "Red";
  }

//Regular function:
  changeColor = function() {
    document.getElementById("demo").innerHTML += this;
  }
}

const myheader = new Header();

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

//A button object calls the function:
document.getElementById("btn").addEventListener("click", myheader.changeColor);

उदाहरण

एक तीर फ़ंक्शन के साथ, thisहेडर ऑब्जेक्ट का प्रतिनिधित्व करता है चाहे कोई भी फ़ंक्शन कॉल करे:

class Header {
  constructor() {
    this.color = "Red";
  }

//Arrow function:
  changeColor = () => {
    document.getElementById("demo").innerHTML += this;
  }
}

const myheader = new Header();


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

//A button object calls the function:
document.getElementById("btn").addEventListener("click", myheader.changeColor);