JS如何从每个循环内的数组内部的数组中获取对象值

Question

我正试图从json文件中获取值

这是我在codepen.io/krm218/pen/vGvaNN

上工作的实时编写码器

这是我的json文件的屏幕截图 或转到https://api.myjson.com/bins/4ky5s

我正在尝试从images数组中检索主视图，alt-view-1等。 我已经能够使用此代码获取描述和id等其他值

 $.getJSON("json.json", function(data){
  $.each(data.products, function() {
  $("#results").append(
   this["id"] + this["description"]
   );   
  });  
});

当我this["images"]时，我得到了

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

我如何获得这些价值？

Answer 1

以下是您可以进入的地方：

[dcl.init.ref]/5

var arr = obj.products;

for (var i = 0; i < arr.length; i++) {
  var images = arr[i].images;
  for (var img in images) {
    console.log(images[img]);
  }
}

Answer 2

我稍微修改了你的JSON，以便将图像存储为产品对象下的对象（如关联数组），所以我在这里开始使用JSON（我只添加了一个产品）：

var data = {
  products:[
    {
      description:'Matte black',
      id:1,
      images:{
        "main-view":'/images/1/mainView.png',
        "alt-view-1":"/images/1/altView1.png",
        "alt-view-2":"/images/1/altView2.png",
        "alt-view-3":"/images/1/altView3.png",
        "alt-view-4":"/images/1/altView4.png",
        "alt-view-5":"/images/1/altView5.png"
      }
    }
  ]
};

使用这种格式，您可以使用jQuery each函数循环遍历图像，参数是每个函数中的键名和值。您可以通过循环并使用k和v分别打印它们的键和值来构建它们的图像列表（或使用值）：

$.each(data.products, function(){

  var imageList = $("<div>").addClass("image-list");

  $.each(this.images, function(k, v){
    imageList.append(
      $("<div>").addClass('image').append(
        $("<span>").addClass('image-name').append(k + " = "),
        $("<span>").addClass('image-url').append(v)
      )
    );
  });

  $('#results').append(
    $("<div>").addClass('product').append(
      $("<div>").addClass('product-id').append(this.id),
      $("<div>").addClass('product-desc').append(this.description),
      imageList
    )
  );
});

结果应如下所示：

1
Matte black
main-view = /images/1/mainView.png
alt-view-1 = /images/1/altView1.png
alt-view-2 = /images/1/altView2.png
alt-view-3 = /images/1/altView3.png
alt-view-4 = /images/1/altView4.png
alt-view-5 = /images/1/altView5.png

这是一个小提琴演示：https://jsfiddle.net/5yc733k4/

Answer 3

this.images [0] ['main-view'] 就行了！