如何以正确的方式返回对象值

Question

我正在尝试返回一个全局变量并在数组中设置一个对象。

谁能解释我在检索全局变量outPutArray 时做错了什么？当我尝试返回它时它变得未定义。

var outPutArray = {};
var goAjax = function(data, filePath) {
  data = $(this).serialize() + "&" + $.param(data);
  $.ajax({
    type: "POST",
    dataType: "json",
    url: filePath, //Relative or absolute path to response.php file
    data: data,
    success: function(data) {
      for (x in data) {
        outPutArray[x] = data[x];
      }
      //logs the the wanted value
      console.log('inside ' + outPutArray['json']);
    }
  });
};

goAjax.prototype.getValue = function() {
  console.log('outside ' + outPutArray['json']);
  //logs undefined ??
};

Answer 1

当你尝试返回它时它是未定义的，因为 AJAX 是异步的。

请参阅 this questions 和 this question，或 Google“返回 AJAX 响应”或类似内容。

这归结为异步调用发生在正常事件循环和执行之外的事实，因此当您设置具有异步响应的全局变量时，JavaScript 无法“知道”它何时会到达那里。

Answer 2

首先，我要感谢所有试图帮助我的人。答案是使用一个参数，它可以作为 java 中的接口来触发另一个函数中的函数或要在其他方法中触发的方法。

 /**
   *This is a constructor of javascript firing a server side PHP script.
   * 
 * @param {Object} filePath PHP file path
   */
 var AjsToPHP = function(filePath){
 this.filePath = filePath;
   };
      
       
 /**
  * 
  * Firing server side PHP script and return respond as an array.
 * @param {Object} data Input an array of object to go as POST command.
 * @param {Object} response An interface function to return the respond value.
  */
  AjsToPHP.prototype.PHP_PROCESS_RETURN = function(data,response){
  	 var PHP_RETURNS= {}; 
    data = $(this).serialize() + "&" + $.param(data);

  $.ajax({
      type: "POST",
      dataType: "json",
      url: this.filePath, //Relative or absolute path to response.php file
      data: data,
      success: function(data) {
      for (x in data) {
       PHP_RETURNS[x] = data[x];
 
        }
          response(PHP_RETURNS);

    
      }
    });
  };



/**
 * 
 * Firing server side PHP script and return respond OK if it success.
 * @param {Object} data Input an array of object to go as POST command.
 * @param {Object} response An interface function to return the respond value.
 */
 AjsToPHP.prototype.PHP_PROCESS = function(data,response){
  	 var PHP_RETURNS= ""; 
    data = $(this).serialize() + "&" + $.param(data);

  $.ajax({
      type: "POST",
      dataType: "json",
      url: this.filePath, //Relative or absolute path to response.php file
      data: data,
      success: function(data) {     
       PHP_RETURNS= "ok";     
          response(PHP_RETURNS);

      }
    });
 };
   

一个例子

<script src="jsToPHP.js"></script>  
<script src="js/jquery-1.8.2.min.js"></script>
$("document").ready(function(){


        var data = {
      "action": "test",
      "Name" :"abdulla"
        };



var obj = new AjsToPHP("response.php");

obj.PHP_PROCESS_RETURN(data,function(PHP_RESPONE){	
	alert('inside '+PHP_RESPONE['json']);
});


obj.PHP_PROCESS(data,function(PHP_RESPONE){
	
	alert(PHP_RESPONE);
	
	
});

response.php 脚本

<?php



function is_ajax() {
  return isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest';
}



if (is_ajax()) {
    
       
  if (isset($_POST["action"]) && !empty($_POST["action"])) { //Checks if action value exists
    $action = $_POST["action"];
  
    switch($action) { //This is how we are able to create different function according to different function call
      case "test": test_function(); break;
    }
  }
  
  
  
  
}



function test_function(){
 

 //this a correct way of creating an associative array.
  $name = $_POST["Name"];
  $return["name"] = $name;
  $return["favorite_beverage"] = "Coke";
  $return["favorite_restaurant"] = "McDonald's";  
  $return["json"] = json_encode($return); 
  
  //return data to javascript
  echo json_encode($return); 
}













?>