如何使用两个数组创建一个json数据并将其返回给ajax

Posted 2023-02-22

【中文标题】如何使用两个数组创建一个json数据并将其返回给ajax

【英文标题】：How to create a json data using two arrays and return it to ajax

【发布时间】：2016-08-25 16:02:52

【问题描述】：

键：[id,name,address]

值：[7,John,NewYork]

我希望使用 for(...)... 创建一个像"id": 7, "name": "John", "address": "NewYork" 这样的 json 数据，

然后返回给ajax

$.ajax(                                
    //what kind of format should json data be here? 
    data:??json data??,
    dataType: 'json',
);

请帮帮我

【参考方案1】：

你可以：

遍历两个数组...

...将第一个数组元素作为键添加到空 obj...

...并将第二个数组元素作为它的值分配给第一个数组元素。

当字符串化为 JSON 时，每次迭代都将作为键/值配对。

我很惊讶它确实有效，看看下面的演示：

片段

var x = ['id', 'name', 'address'];

var y = [7, 'John', 'NewYork'];

function arrMerge(k, v) 

  var obj = ;

  for (var i = 0; i < k.length; i++) 

    obj[k[i]] = v[i];
  

  return obj;


var z = arrMerge(x, y);

var json = JSON.stringify(z);

console.log(json);

【讨论】：

感谢帮助，$.ajax(...data:json,...)，返回数据成功。

不客气，先生。我正准备做 AJAX 部分，但我看到你已经处理了那部分。

【参考方案2】：

我想与 forEach 不同，因为它返回结果，Array.prototype.reduce() 对于这些操作非常方便。您甚至可以在声明 JSON 数据的阶段使用它（jData 此处）。

var   key = ['id', 'name', 'address'],
    value = [7, 'John', 'New York'],
    jData = JSON.stringify(key.reduce((p,c,i) => p[c] = value[i]; return p,));
document.write("<pre>" + jData + "</pre>");

【参考方案3】：

您可以编写一个通用函数，如果两个数组长度相等（同时假设它们的顺序正确），则将它们一起压缩成一个对象。

function zip(arr1, arr2) 
  if (arr1.length !== arr2.length) return false;
  const obj = ;
  for (let i = 0; i < arr1.length; i++) 
    const key = arr1[i];
    obj[key] = arr2[i];
  
  return obj;


zip(arr1, arr2); //  id: 7, name: "John", address: "NewYork" 

DEMO

然后，您可以在 AJAX 进程中将该对象用作 data 的值。

数据

类型：PlainObject 或字符串或数组

要发送到服务器的数据。如果还不是字符串，则将其转换为查询字符串。

jQuery documentation

【讨论】：

根据你的demo，我可以一步步理解obj的构建过程了。

【参考方案4】：

到你问题的第一部分：

您可以使用Array#forEach() 并为所有属性分配对应的值。

var key = ['id', 'name', 'address'],
    value = [7, 'John', 'New York'],
    object = ;

key.forEach(function (k, i) 
    object[k] = value[i];
)

document.write('<pre>' + JSON.stringify(object, 0, 4) + '</pre>');

【讨论】：

您也可以在创建object 时使用Array#reduce 以避免独立的forEach。 jsfiddle.net/5qhyp9eL/1

非常感谢，按照您的建议，我的问题已经解决了。