Call, Applay and Bind

 Call 

function greet(name,age){
    return `my name is ${name} and age ${age}`
}
let result = greet("pankaj",100);
console.log(result);


Here, you're simply calling the greet() function with arguments directly. This works fine, and there's no need for call() in this case because you're just invoking the function as usual.


Use Call 

function greet(name,age){
   console.log(`my name is ${name} and age ${age}`)
}
let result = greet("pankaj",100);
let result2 = greet("raju",200);
console.log(result);
console.log(result2);



function greet1(name,age){
    console.log(`my name is ${this.name} and age ${this.age}`)
 }

let person1 = {
name:"Raju",
age:11,
}

let person2 = {
    name:"pankaj",
    age:10
}
console.log("CALL............")
greet1.call(person1)
greet1.call(person2)

function greet(name, age) {

  console.log(`my name is ${name} and age ${age}`);

}

Name and Age pass directly but not in call

function greet1() {

  console.log(`my name is ${this.name} and age ${this.age}`);

}

Pass explicit 

function showDetails() {
    console.log(`Hi, I'm ${this.name} and I live in ${this.city}`);
  }
 
  const user1 = { name: "Anita", city: "Delhi" };
  const user2 = { name: "Karan", city: "Mumbai" };
 
  showDetails.call(user1);
  showDetails.call(user2);
 

Imagine a utility function that logs details. Instead of rewriting it inside every object, you define it once and use .call():


Apply: It's simmilar to call but main difference we have pass list of arguments.

function showDetails(cource,country) {
    console.log(`Hi, I'm ${this.name} and I live in ${this.city} and courece ${cource}- ${country}`);
  }
 
  const user1 = { name: "Anita", city: "Delhi" };
  const user2 = { name: "Karan", city: "Mumbai" };
 
//   showDetails.call(user1, "rajpur");
//   showDetails.call(user2, "Dehradun");
 
   showDetails.apply(user1, ["rajpur","India"]);
   showDetails.apply(user2, ["Dehradun","India"]);
 


Use Case 1: Save a Function with Fixed this for Later Use

const person = {
    name: "Pankaj",
    greet: function () {
      console.log(`Hello, I am ${this.name}`);
    }
  };
 
  const greetFunc = person.greet.bind(person); // Fixes `this` to `person`
 
  setTimeout(greetFunc, 1000); // Will print: Hello, I am Pankaj

 Use Case 2: Reuse a Function with a Specific Context

function showDetails(course) {
    console.log(`${this.name} from ${this.city} is enrolled in ${course}`);
  }
 
  const user1 = { name: "Ravi", city: "Delhi" };
 
  const showForUser1 = showDetails.bind(user1);
  showForUser1("JavaScript");
 

 Use Case 3: Partial Function Application (Pre-set Arguments)

function multiply(a, b) {
    return a * b;
  }
 
  const double = multiply.bind(null, 2); // Fix `a` as 2
  console.log(double(5)); // 10


Comments

Post a Comment

Popular posts from this blog

Spread and Rest

Image
 Spread and Rest Spread and Rest boths are donated by (...)  three doted USES:  Both are use in arrya and object  SPREAD Spread  is use to expand the array and object. 1. Spread behave with array  As mentioned above, the ... syntax is used to expand values. In this case, arr1 is being expanded inside arr2 using the spread operator. 2. Spread behave with object Obj2 is expand so obj behave like as a spread operator  Rest  Rest Operator with array    1. The rest operator is used to combine multiple values into a single array. It’s especially useful when we don’t know how many arguments a function will receive. function sum(...numbers) {   return numbers.reduce((a, b) => a + b, 0); } sum(1, 2, 3);  Rest with Object const user = {   name: 'Sameer',   age: 25,   location: 'India',   profession: 'Developer' }; const { name, ...rest } = user;   
Read more

Shallow Copy and Deep Copy in JavaScript

Image
Shallow Copy in JavaScript When we use the spread operator ( ... ) or methods like Object.assign() or slice() to copy an object or array, it creates a shallow copy . This means only the top-level properties are copied, while nested objects or arrays are still referenced , not cloned. 🧪 Example with Array let a = [ 10 , 20 , [ 30 , 40 ]]; let b = [ ... a ]; // Shallow copy b [ 0 ] = 100 ; console . log ( a ); // [10, 20, [30, 40]] console . log ( b ); // [100, 20, [30, 40]] Here , b is a shallow copy of a . When we change b [ 0 ], it doesn ’ t affect the original . So far , so good . But now , let ’ s try changing the nested array b [ 2 ][ 0 ] = 300 ; console . log ( a ); // [10, 20, [300, 40]] console . log ( b ); // [100, 20, [300, 40]] Now both a and b are affected! That’s the problem with shallow copies — the nested values are shared by reference . Deep copy solves the problem of modifying nested arrays without affecting the original array. For ...
Read more
Image
   DOCKER Docker Engine Docker CLI - Command line interface Docker registry Docker Engine is an open-source containerization technology that allows developers to package applications into container Containers are standardized executable components combining application source code with the operating system (OS) libraries and dependencies required to run that code in any environment. 2. Docker CLI The command line interface lets you talk to the docker engine and lets you start/stop/list containers docker run -d -p 27017 : 27017 mongo \4 3. Docker registry The docker registry is how Docker makes money. It is similar to github , but it lets you push images rather than sourcecode Images vs containers Docker Image A Docker image is a lightweight, standalone, executable package that includes everything needed to run a piece of software, including the code, a runtime, libraries, environment variables, and config files. Docker Container A container is a running instance of an im...
Read more