Question

我需要帮助，我想创建一个从AJAX请求返回对象的函数，所以我可以从服务器上的数据创建一个新对象，如下所示：

var foo = bar('api.php?x=y');

该函数应该将查询字符串作为参数，服务器将数据作为JSON返回。

您能告诉我如何使用jQuery执行此操作，您有任何想法/示例吗？

我会扩展我的问题，因为看起来我做错了。我正在尝试创建基于实时数据（股票报价）的网络应用程序它必须不断地从服务器请求更新的信息。当应用程序初始化时，第一步是从要包含的股票中获取静态数据（例如股票代码和发行人），我认为最好的方法是在服务器上安装一个数据库和一个执行该操作的API。查询并将选定的库存数据作为JSON返回。下一步是向服务器上的另一个API发出请求，该请求返回所选股票的实时数据（例如价格和交易量），当返回完整数据时，使用模板引擎将其呈现为html。然后，应用程序必须在某个时间间隔内不断调用第二个API以更新实时数据并再次渲染。此外，您应该能够选择新的股票并重新开始这个过程。

我认为构建这样的应用程序的最佳方法是将数据放在自定义对象中，该对象有自己的方法以便稍后修改数据（例如排序和过滤），所以如果foo是我的使用库存数据的对象我可以执行foo.sort()之类的操作，或类似foo.render()之类的操作来创建数据的html表示。这就是为什么我认为最好的方法是从AJAX调用返回的数据创建一个对象。 您能告诉我这是否是构建这样的应用程序的正确方法，还是指向了正确的方向？

由于

Answer 1

根据定义，AJAX是异步的，因此它不适合您的问题。我建议使用jQuery.ajax（see reference）代替回调：

$.ajax({
  url: 'api.php?x=y',
  dataType: 'json',
  success: function (foo) {
    // Do stuff here using 'foo'
  }
});

Answer 2

如果JSON字符串是服务器响应的内容，那么只需将它转换为JS对象就很容易......

var resp_object = JSON.parse(response);

Answer 3

你正在思考你的方法。

这意味着您认为您的函数调用“bar（'api.php？x = y'）”应立即返回检索到的数据/对象。这样做的缺点是，在等待答案时，浏览器中的代码执行被阻止。

为了解决这个问题，你需要创建一个异步回调处理程序（使用"jQuery.ajax"时的“成功”处理程序），正如user595228之前指出的那样。呈现返回信息的代码将进入此处理程序。

对于如何构造代码的问题，它取决于您获得的数据的复杂程度以及在应用程序中使用它的频率。如果它的复杂性并在多个地方使用，那么创建一个带辅助函数的数据对象可能是有意义的，以避免代码重复并将有关数据的代码放在一个地方。如果你只在一个地方渲染它们，你唯一要做的就是简单的排序和显示，我会把这个逻辑放在一个简单的函数中，以降低复杂性。

Answer 4

您可以创建一个Jquery插件并将对象挂钩。例如：

var foo = tablesort({}); // tablesort is plugin Jquery
foo.sort();

你需要在Jquery插件中实现排序方法，它意味着：从服务器使用ajax获取数据并填充对象的属性或执行某些操作

Answer 5

实时数据是否被推送给您？我的意思是，如果你现在没有听到什么东西，那么你想念它的数据是什么？或者它是否在队列中积累，等待您轮询并获取它？

如果您有第一种情况，您可以让您的服务器从库存服务获取数据并为您排队 - 这会让您对如何处理多个用户的队列产生疑问。或者您可以设置websocket（在所有浏览器中不支持HTML5）或者查看彗星解决方案（可能涉及flash对象或大量快速轮询）。

如果你有第二种情况，那么你可以使用Ajax来获取计时器上可用的数据块。您需要使用ajax的异步方面，否则您的屏幕可能会冻结等待响应。使用像jquery这样的东西来帮助你完成这个过程 - 无需重新发明轮子。

Answer 6

我通常更喜欢将数据的表示与数据本身分开。我建议不要在从服务器接收到对象后添加函数，而是传递数据对象。

示例：

function renderStockData(data) {
  // build and return HTML from data
}

function loadStockData(url, callback) {
  $.ajax({
    url: url,
    dataType: 'json',
    success: callback
  });
}

// Later that day...
loadStockData('api?stock=GOOG', function (data) {
  var renderedHtml = renderStockData(data);
  // ...
});

这是您正在寻找的建议类型吗？

如何从服务器返回的JSON数据创建JavaScript对象

6 个答案: