使用 jQuery 循环嵌套数组值

Question

使用下面的 JSON，如何使用 jQuery 循环内部 Errors 和 Messages 值：

JSON 格式：

{
   "PagesCreated":0,
   "AssetsCreated":0,
   "AssetsUpdated":0,
   "Messages":[
      "Test message!",
      "Test message!",
      "Test message!"
   ],
   "Errors":[
      "Test error!",
      "Test error!",
      "Test error!"
   ],
   "EllapsedTime":"00:00:00.0000382"
}

当前 jQuery 在 ajax 成功调用中到位：

$.each(data, function (key, value) {
    if (key == "PagesCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsUpdated") {
        console.log(value); // works
    }
    else if (key == "EllapsedTime") {
        console.log(value); // works
    }
    else if (key == "Messages") {
        // TODO - How do I loop inner Messages values here?
    }
    else if (key == "Errors") {
        // TODO - How do I loop inner Errors values here?
    }
});

如果有帮助，这是我要序列化为 json 的 c# 对象：

public class MyObj
{
    public int PagesCreated { get; set; }
    public int AssetsCreated { get; set; }
    public int AssetsUpdated { get; set; }
    public TimeSpan EllapsedTime { get; set; }
    public List<string> Messages { get; set; }
    public List<string> Errors { get; set; }
}

感谢您的帮助！

Answer 1

你可以再次使用 .each 方法：

$.each(data, function (key, value) {
    if (key == "PagesCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsCreated") {
        console.log(value); // works
    }
    else if (key == "AssetsUpdated") {
        console.log(value); // works
    }
    else if (key == "EllapsedTime") {
        console.log(value); // works
    }
    else if (key == "Messages") {
        $.each(value, function (innerKey, innerValue) {
           console.log(innerValue);
       }
    }
    else if (key == "Errors") {
        $.each(value, function (innerKey, innerValue) {
           console.log(innerValue);
       }
    }
});

Answer 2

请不要使用 jQuery 循环数组。 Plain JS 效果很好，可以在所有框架中复用

您可以测试类型并做出相应的反应

const data = { "PagesCreated": 0, "AssetsCreated": 0, "AssetsUpdated": 0, "Messages": [ "Test message!", "Test message!", "Test message!" ], "Errors": [ "Test error!", "Test error!", "Test error!" ], "ElapsedTime": "00:00:00.0000382" };

Object.entries(data).forEach(([key, value]) => {
  if (typeof value == "object") {
    console.log(key, value.join(", "))
  } else console.log(key, value)
});

jQuery 版本 - 唯一的区别是 $.each(data,(key, value) => {

const data = { "PagesCreated": 0, "AssetsCreated": 0, "AssetsUpdated": 0, "Messages": [ "Test message!", "Test message!", "Test message!" ], "Errors": [ "Test error!", "Test error!", "Test error!" ], "ElapsedTime": "00:00:00.0000382" }

$.each(data,(key, value) => { 
  if (typeof value == "object") {
    console.log(key, value.join(", "))
  } else console.log(key, value)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>