How to borrow methods in JavaScript?

JavascriptWeb DevelopmentObject Oriented Programming

The call(), apply() and bind() are used to borrow methods in JavaScript.

Following is the code for borrowing methods in JavaScript −

Example

 Live Demo

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document<title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result,.sample {
      font-size: 18px;
      font-weight: 500;
      color: rebeccapurple;
   }
   .result {
      color: red;
   }
</style>
</head>
<body>
<h1>Borrowing a method in JavaScript</h1>
<div class="sample"></div>
<div class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>
Click on the above button to borrow the welcome method of object obj
</h3>
<script>
   let sampleEle = document.querySelector(".sample");
   let resultEle = document.querySelector(".result");
   let obj = {
      firstName: "Rohan",
      lastName: "Sharma",
      welcome() {
         return "Welcome " + this.firstName + " " + this.lastName;
      },
   };
   let obj1 = {
      firstName: "John",
      lastName: "Shaw",
   };
   sampleEle.innerHTML = "obj.welcome() = " + obj.welcome();
   document.querySelector(".Btn").addEventListener("click", () => {
      resultEle.innerHTML = "obj1.welcome() = " + obj.welcome.call(obj1);
   });
</script>
</body>
</html>

Output

The above code will produce the following output −

On clicking the ‘CLICK HERE’ button −

raja
Published on 17-Jul-2020 07:24:25

Advertisements