Question

我正在尝试从服务器端的数据库中获取基于id的某些类。从服务器发送的数据是JSON格式。以下是我目前正在使用的JSON：

var classes = {
  "success": true,
  "data": [
    {
      "id": 1,
      "name": "mechanics",
      "created_at": "2016-08-08T15:37:14"
    },
    {
      "id": 2,
      "name": "mechanics",
      "created_at": "2011-10-02T23:25:42"
    },
    {
      "id": 4,
      "name": "Stephen's Rad New Course",
      "created_at": "2016-09-07T15:44:50"
    },
    {
      "id": 5,
      "name": "English",
      "created_at": "2016-10-28T07:09:45"
    },
    {
      "id": 6,
      "name": "Mathematics",
      "created_at": "2017-02-15T13:33:49"
    }
  ]
}

我使用的id取自另一个JSON：

var student = {
  "success": true,
  "data": {
    "privileges": [
      {
        "type": "mac"
      },
      {
        "type": "scones"
      }
    ],
    "fname": "Luke",
    "loaned": [],
    "classes": [
      {
        "name": "Stephen's Rad New Course",
        "id": 4,
        "created_at": "2016-09-07T15:44:50"
      },
      {
        "name": "Mathematics",
        "id": 6,
        "created_at": "2017-02-15T13:33:49"
      }
    ],
    "type": "student",
    "created_at": "2016-08-24T09:35:26",
    "lname": "Skywalker",
    "id": 44,
    "email": "skywalker.ftw@cedarhouse.co.za"
  }
}

以下是我用来过滤数据的代码：

for (var j = 0; j < student.data.classes.length; j++) {
    var class_id = student.data.classes[j].id;
    classes = $.grep(classes, function(n, i) {
        return n.id == class_id;
    });
}
console.log(JSON.stringify(classes));

根据学生JSON数据的类，只显示ID为4和6的两个类，但现在没有显示任何内容。

Answer 1

您正在将非数组classes传递给$.grep（您可能打算classes.data），并且您在之前的所有作业中都覆盖了classes之前的作业迭代循环。

相反，在数组中收集id值，然后使用id（或现代浏览器中的Array#indexOf过滤那个数组中的Array#includes个：

var class_ids = student.data.classes.map(function (cls) {
    return cls.id;
});

classes.data = classes.data.filter(function(n) {
    return class_ids.indexOf(n.id) > -1;
});
console.log(classes);

var classes = {
  "success": true,
  "data": [
    {
      "id": 1,
      "name": "mechanics",
      "created_at": "2016-08-08T15:37:14"
    },
    {
      "id": 2,
      "name": "mechanics",
      "created_at": "2011-10-02T23:25:42"
    },
    {
      "id": 4,
      "name": "Stephen's Rad New Course",
      "created_at": "2016-09-07T15:44:50"
    },
    {
      "id": 5,
      "name": "English",
      "created_at": "2016-10-28T07:09:45"
    },
    {
      "id": 6,
      "name": "Mathematics",
      "created_at": "2017-02-15T13:33:49"
    }
  ]
}

var student = {
  "success": true,
  "data": {
    "privileges": [
      {
        "type": "mac"
      },
      {
        "type": "scones"
      }
    ],
    "fname": "Luke",
    "loaned": [],
    "classes": [
      {
        "name": "Stephen's Rad New Course",
        "id": 4,
        "created_at": "2016-09-07T15:44:50"
      },
      {
        "name": "Mathematics",
        "id": 6,
        "created_at": "2017-02-15T13:33:49"
      }
    ],
    "type": "student",
    "created_at": "2016-08-24T09:35:26",
    "lname": "Skywalker",
    "id": 44,
    "email": "skywalker.ftw@cedarhouse.co.za"
  }
}

var class_ids = student.data.classes.map(function (cls) {
    return cls.id;
});

classes.data = classes.data.filter(function(n) {
    return class_ids.indexOf(n.id) > -1;
});
console.log(classes);

.as-console-wrapper { max-height: 100% !important; top: 0; }

除非您使用的是非常过时的浏览器，否则无需使用jQuery。

jQuery $ .grep返回空JSON

1 个答案: