js中如何返回一个存放对象的数组？

最新推荐文章于 2023-07-20 14:30:12 发布

转载最新推荐文章于 2023-07-20 14:30:12 发布 · 1.6k 阅读

文章标签：

#javascript #前端 #ViewUI

本文介绍如何使用JavaScript构造一个特定格式的数据对象数组。通过定义一个构造函数和一个数组，利用循环来填充数组，并最终输出所需的格式。

我这边需要返回后台数据的形式是这样的

{[
  {
    "ItemId": "18",
    "SelectId": 2
  },
  {
    "ItemId": "19",
    "SelectId": 1
  },
  {
    "ItemId": "20",
    "SelectId": 1
  },
  {
    "ItemId": "21",
    "SelectId": 4
  },
  {
    "ItemId": "22",
    "SelectId": 4
  }
]}

页面是通过循环去获取每一个对象中属性的值

 {
    "ItemId": "21",
    "SelectId": 4
  }

那么在js页面中，如何返回一个这样格式的数据呢？

[
  {
    "ItemId": "18",
    "SelectId": 2
  },
  {
    "ItemId": "19",
    "SelectId": 1
  },
  {
    "ItemId": "20",
    "SelectId": 1
  }
]

首先在js中定义一个函数对象goods（item1,item2）

//定义函数 goods 返回所需的数据
  function goods(item1,item2){
      return {"ItemId":item1,"SelectId":item2};
  }

然后定义一个数组对象Array

//定义一个数组对象，存放函数对象
var array = new Array();

下一步，追加函数对象值到数组中

//循环5次追加数据到数组中
 for(var i=0;i<5;i++){
      array.push(goods((i+1),(i+10)));     
}

查看数组是否保存添加的数据

 //循环查看
 for(var j=0;j<array.length;j++){
       console.log(array[j]);                 
 }

查看数组的结果

测试全部代码：

Html页面

<body>
     <input type="button" value="测试数组"  onClick="Test()" />
</body>

js页面

<script>
       //定义js函数对象方法
     function goods(item1,item2){
        return {"ItemId":item1,"SelectId":item2};     
     }
     function Test(){
         //定义存放函数对象的数组
         var array = new Array();
         //循环5次追加数据到数组中
         for(var i=0;i<5;i++){
            array.push(goods((i+1),(i+10)));     
         }
         //循环查看
         for(var j=0;j<array.length;j++){
             console.log(array[j]);                 
         }     
    }
</script>

测试的结果（谷歌调试界面）