¿Cómo acceder al `this` correcto dentro de una devolución de llamada?

En JavaScript, ‘esto’ se comporta de manera diferente en comparación con otros lenguajes de programación. Si estamos realizando una llamada de función normal, entonces ‘esto’ apunta al objeto de la ventana. Pero estamos llamando a la función de manera diferente a que ‘esto’ apuntará a un objeto cercano. Para entenderlo mejor a continuación, elaboramos con dos fragmentos de código con dos enfoques de llamada diferentes.

Ejemplo 1: cuando llamamos a una función de forma normal en el siguiente ejemplo

function printThis(){
  
  console.log(this);
  
}
  
printThis();

Producción:

Ejemplo 2: Cuando llamamos a una función usando notación de objetos.

var obj={
 name: "Ramesh",
 printThis: function(){
    console.log(this);
 }
}
  
obj.printThis();

Producción:

 Entonces, a partir de los dos ejemplos anteriores, podemos entender claramente el comportamiento de ‘esto’ cuando hacemos diferentes tipos de llamadas a funciones. 
 

Enfoque: Primero cree un objeto e ingrese las propiedades de la muestra. Asegúrese de agregar una función para una tecla, en esa función agregue una función de devolución de llamada usando setTimeout. Dentro de esta función setTimeout, use ‘bind’ para vincular el contexto de esto y luego devolver esto.
 

• Ejemplo: Uso de Bind

  JavaScript

  var outerFunction= function(){    innerFunction = function() {    };     setTimeout(innerFunction.bind(this),2000);      return this; };    var obj = { method: outerFunction ,company :'geeksforgeeks'} ; obj.method();

• Producción: