objeto en objeto

Question

var UsersMenu = function(){ 
    this.returnUsers = []; 
    this.retrieve = function(posts){ 
     var temp = []; 
     $.post("router.php", { "action": "getUsersMenu", "posts" : posts}, 
     function(data) 
     { 
      if(data.response){  
       for(var i=0; i<data.returnUsers.length; i++){ 
        temp.push(data.returnUsers[i]); 
       } 
       this.returnUsers = temp; // i know what 'this' is incorrect 
      } 

     }, "json"); 
       alert(this.returnUsers); 
    } 
} 

2 preguntas: 1. ¿Cómo
para acceder a los padres 'esto' a partir de objetos (JQ returnUsers)?
2. ¿Por qué la alerta después de la publicación jq llama antes de una alerta en la publicación jq?

Answer 1

1 ¿Cómo acceder al elemento 'this' del objeto jq (returnUsers)?

Se podía capturarlo en un cierre:

var UsersMenu = function() { 
    this.returnUsers = []; 
    var self = this; 
    this.retrieve = function(posts) { 
     var temp = []; 
     $.post("router.php", { "action": "getUsersMenu", "posts" : posts }, 
     function(data) { 
      if(data.response) { 
       for(var i = 0; i < data.returnUsers.length; i++) { 
        temp.push(data.returnUsers[i]); 
       } 
       self.returnUsers = temp; 
      } 
     }, "json"); 
    } 
}; 

2 ¿Por qué alerta después del post JQ está llamando antes de que algunos de alerta en la post JQ?

Porque AJAX es asíncrono. El método $.post que envía una solicitud AJAX devuelve inmediatamente pero el controlador de devolución de llamada correcta se ejecuta mucho más tarde, cuando se recibe una respuesta del servidor. Por lo tanto, no debe colocar la alerta fuera de este controlador de éxito. Si desea consumir los resultados de una llamada AJAX, esto debería ocurrir solo dentro de la devolución de llamada, que es cuando el resultado está disponible.

Answer 2

Respondo su segunda pregunta.

¿Por qué la alerta después de que jq post llame antes de alguna alerta en jq post?

Porque AJAX es asíncrono, lo que significa que inicia una solicitud AJAX y no espera el resultado. Simplemente registra una función de devolución de llamada y continúa con el resto del código. Este "resto del código" en su caso es la declaración alert.

Es altamente improbable (si no imposible) imposible que su respuesta AJAX llegue antes de que el control llegue a la instrucción alert.

Answer 3

1 - Utilice una variable como that como

var that = this.returnUsers; 

a continuación en el interior del JQ Funciton puede hacer referencia a ella como:

if(data.response){ 
     for(var i=0; i<data.returnUsers.length; i++){ 
      temp.push(data.returnUsers[i]); 
     } 
      that = temp; // Now 'this' is correct 
    } 

2 - Este becouse llamadas ajax son por defecto asíncrono , significa que el intérprete de JavaScript no esperará a que se complete la llamada ajax y continuará ejecutando las siguientes declaraciones, por lo tanto, ponga la alerta en una función de devolución de llamada.

Answer 4

1. cómo tener acceso a los padres 'esto' de un objeto (JQ) returnUsers?

Usted debe poner el padre 'esto' en una variable local, como var self = this; fuera de la función de devolución de llamada, y luego usar self.returnUsers = temp;.

1. Por qué alerta después del post JQ está llamando antes de que algunos de alerta en la post JQ?

Debido ajax funciona de forma asíncrona, sin embargo para el método jQuery.ajax, se puede establecer que funcione de forma sincrónica por async: false.

Answer 5

Para responder primero a su segunda pregunta: La función $.post() comienza una solicitud asíncrona Ajax. Esto significa que la función $.post() se devuelve inmediatamente y la ejecución continúa con la siguiente línea de código, que en este caso es alert(). Luego, una vez que la solicitud de Ajax complete la función anónima que proporcionó al $.post(), se ejecutará una devolución de llamada, de modo que si esa función también contiene un alert(), se mostraría.

En cuanto a su primera pregunta: el valor de this en una función depende de cómo se llamó a una función, y jQuery normalmente lo establece cuando llama a sus funciones de devolución de llamada, pero por supuesto no lo configurará en su objeto UserMenu . La solución más fácil es ahorrar this en una variable que es local a la función retrieve() y luego hacer referencia esa variable desde tu función:

var UsersMenu = function(){ 
    this.returnUsers = []; 
    this.retrieve = function(posts){ 
      var self = this, 
      temp = []; 
      $.post("router.php", { "action": "getUsersMenu", "posts" : posts}, 
      function(data) 
      { 
       if(data.response){  
        for(var i=0; i<data.returnUsers.length; i++){ 
         temp.push(data.returnUsers[i]); 
        } 
        self.returnUsers = temp; 
       }    
      }, "json"); 
      alert(this.returnUsers); 
    } 
} 

A pesar de que la función retrieve() habrá terminado para cuando la devolución de llamada Ajax es ejecutar el La magia de los cierres de JavaScript significa que la función anónima interna aún tiene acceso a esas variables locales.